From 230135cc0ca7c5d7d0251eeb8c14888e9a19fcd8 Mon Sep 17 00:00:00 2001
From: Jon McClure <jon.r.mcclure@gmail.com>
Date: Tue, 19 Sep 2023 08:30:46 +0100
Subject: [PATCH] colour partial formatting

---
 .../docs-components/CopyColourTable/ImportSnippet.jsx     | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/docs/docs-components/CopyColourTable/ImportSnippet.jsx b/src/docs/docs-components/CopyColourTable/ImportSnippet.jsx
index 6a6ab81a..24ff8835 100644
--- a/src/docs/docs-components/CopyColourTable/ImportSnippet.jsx
+++ b/src/docs/docs-components/CopyColourTable/ImportSnippet.jsx
@@ -8,6 +8,10 @@ import scss from 'react-syntax-highlighter/dist/esm/languages/prism/scss';
 
 SyntaxHighlighter.registerLanguage('scss', scss);
 
+const formatPartial = (partial) => {
+  return partial.replace(/\/_/, '/').replace(/\.scss$/, '');
+};
+
 const Copyable = (props) => {
   const [copied, setCopied] = useState(false);
 
@@ -19,7 +23,7 @@ const Copyable = (props) => {
   }, [copied]);
 
   const handleClick = async({ partial }) => {
-    const copyText = `@import "@reuters-graphics/graphics-components/dist/scss/colours/${partial}";`
+    const copyText = `@import "@reuters-graphics/graphics-components/scss/colours/${formatPartial(partial)}";`
     await navigator.clipboard.writeText(copyText);
     setCopied(true);
   }
@@ -40,7 +44,7 @@ const ImportSnippet = ({ included = false, partial = 'thematic/_tr.scss' }) => {
   ) : (
     <div className={classes.importsnippet}>
       <SyntaxHighlighter language="scss" style={prism}>
-        {`// global.scss \n@import "@reuters-graphics/graphics-components/dist/scss/colours/${partial}";`}
+        {`// global.scss \n@import "@reuters-graphics/graphics-components/scss/colours/${formatPartial(partial)}";`}
       </SyntaxHighlighter>
       <Copyable partial={partial} />
     </div>