Merge pull request #870 from griffithlab/rst-icon-aliases

new dev scripts to help keep civic-docs updated w/ client icon & model changes

client/package.json

@@ -13,7 +13,10 @@
     "generate-icon-ts": "svg-to-ts-constants",
     "generate-icons": "yarn run optimize-icon-svg && yarn run generate-icon-ts",
     "generate-apollo": "graphql-codegen",
-    "generate-apollo:start": "graphql-codegen --watch"
+    "generate-apollo:start": "graphql-codegen --watch",
+    "generate-icon-data": "scripts/generate-icon-data.js",
+    "generate-icon-rst": "scripts/generate-icon-rst.js",
+    "generate-docs-rst": "yarn run generate-icon-data && yarn run generate-icon-rst"
   },
   "private": true,
   "resolutions": {
@@ -57,7 +60,9 @@
     "@graphql-codegen/typescript-apollo-client-helpers": "^2.2.6",
     "@graphql-codegen/typescript-operations": "^2.5.12",
     "@types/node": "^12.11.1",
+    "directory-tree": "^3.5.1",
     "graphql": "^16.7.1",
+    "mustache": "^4.2.0",
     "ngx-json-viewer": "^3.0.2",
     "prettier": "^2.5.1",
     "svg-to-ts": "^9.0.0",

client/scripts/generate-icon-data.js

@@ -0,0 +1,64 @@
+#!/usr/bin/env node
+const directoryTree = require('directory-tree')
+const path = require('path')
+const fs = require('fs')
+
+const iconsDirectory = path.join(__dirname, '..', 'src', 'assets', 'icons')
+const validSubdirectories = ['attribute', 'outline', 'twotone', 'fullcolor']
+
+// Utility to remove redundant parent directory name from the filename
+function removeRedundantName(type, filename) {
+  const pattern =
+    type === 'attribute' ? /-outline$/ : new RegExp(`-${type}$`, 'i')
+  return filename.replace(pattern, '')
+}
+
+function generateIconObject(tree) {
+  if (!tree || !tree.children) return []
+
+  return tree.children
+    .filter((child) => validSubdirectories.includes(child.name))
+    .flatMap((subdir) => {
+      return subdir.children.map((file) => {
+        const cleanName = removeRedundantName(
+          subdir.name,
+          path.basename(file.name, '.svg')
+        )
+        return {
+          type: subdir.name,
+          filepath: `${subdir.name}/${file.name}`,
+          name: cleanName,
+          alias: `${subdir.name}-${cleanName}`,
+        }
+      })
+    })
+}
+
+const tree = directoryTree(iconsDirectory, { extensions: /\.svg$/ })
+
+if (!tree) {
+  console.error(
+    `Error: The icon assets folder ${iconsDirectory} does not exist or could not be accessed.`
+  )
+  process.exit(1)
+}
+
+const icons = generateIconObject(tree)
+const output = {
+  icons: icons,
+}
+
+// Define the path to the output file
+const outputPath = path.join(
+  __dirname,
+  '..',
+  'src',
+  'app',
+  'generated',
+  'civic.icons.data.json'
+)
+
+// Write the JSON data to the file
+fs.writeFileSync(outputPath, JSON.stringify(output, null, 2))
+
+console.log(`Icon data written to ${outputPath}`)

client/scripts/generate-icon-rst.js

@@ -0,0 +1,46 @@
+#!/usr/bin/env node
+const fs = require('fs')
+const path = require('path')
+const mustache = require('mustache')
+
+// Load the generated icon data JSON
+const jsonDataPath = path.join(
+  __dirname,
+  '..',
+  'src',
+  'app',
+  'generated',
+  'civic.icons.data.json'
+)
+const iconData = JSON.parse(fs.readFileSync(jsonDataPath, 'utf-8'))
+
+// Define the mustache template
+const template = `
+.. |{{alias}}| image:: /images/icons/{{{filepath}}}
+   :class: 'cvc-icon'
+`
+
+// Render the RST using mustache
+const renderedRst =
+  '..\n   ' +
+  'GENERATED BY CiVIC CLIENT DEV SCRIPT, DO NOT EDIT\n   ' +
+  '(unless you know what you are doing)\n   ' +
+  'Produced by `generate-icon-rst` script in civic-v2/client/scripts\n' +
+  iconData.icons.map((icon) => mustache.render(template, icon)).join('\n')
+
+// Define the path to the output RST file
+const outputPath = path.join(
+  __dirname,
+  '..',
+  'src',
+  'app',
+  'generated',
+  'civic.docs-aliases.rst'
+)
+
+// Write the rendered RST to the file
+fs.writeFileSync(outputPath, renderedRst)
+
+console.log(
+  `RST written to ${outputPath}, copy to civic-docs/docs/generated to update docs aliases.`
+)