Sync strings in selected node

manifest.json

@@ -6,6 +6,7 @@
   "ui": "dist/ui.html",
   "menu": [
     {"name": "Sync all the copy!", "command": "sync"},
+    {"name": "Sync selected copy!", "command": "sync-selected"},
     {"name": "Configure...", "command": "config"}
   ]
 }

src/code.ts

@@ -16,7 +16,7 @@
 
 import { getAirtableConfig, setAirtableConfig } from './airtable/get-set-airtable-config'
 import { isVar, getVarName } from './var-test'
-import { syncStrings, createReportNode } from './replace-text'
+import { syncStrings, syncStringsSelected, createReportNode } from './replace-text'
 import { getNodeFonts, loadFontList } from './fonts'
 
 const airtableConfig = getAirtableConfig();
@@ -52,6 +52,45 @@ if (figma.command === 'sync' ) {
   })
 }
 
+if (figma.command === 'sync-selected' ) {
+  // Initialize empty array for Airtable filter
+  let varNames = [];
+  let fontsToLoad: FontName[] = [];
+
+  if (figma.currentPage.selection.length < 1) {
+    figma.notify('Nothing is selected!', { timeout: 10000 })
+    figma.closePlugin();
+  }
+  else {
+    var nodes: SceneNode[] = [];
+    figma.currentPage.selection.forEach(async (node: SceneNode) => {
+      if (node.type === "TEXT") {
+        nodes.push(node);
+      }
+      else {
+        nodes = nodes.concat((node as ChildrenMixin).findAll(node => node.type === "TEXT"));
+      }
+    });
+
+    // Delete the old report node (if it's there), and make a new one
+    createReportNode();
+
+    // If variable is found in node name, add to varNames array
+    nodes.forEach(async (node: TextNode) => {
+      if (!isVar(node.name)) return;
+
+      getNodeFonts(node).forEach((font) => fontsToLoad.push(font))
+      varNames.push(getVarName(node.name));
+    });
+
+    // Continue only after the fonts load
+    Promise.all([loadFontList(fontsToLoad)]).then(() => {
+      figma.showUI(__html__, { visible: false });
+      figma.ui.postMessage({ type: 'sync-selected', airtableConfig, varNames });
+    })
+  }
+}
+
 // Calls to "parent.postMessage" from within the HTML page will trigger this
 // callback. The callback will be passed the "pluginMessage" property of the
 // posted message.
@@ -67,6 +106,10 @@ figma.ui.onmessage = async (msg) => {
     syncStrings(msg.strings);
   }
 
+  if (msg.type === 'sync-airtable-strings-selected') {
+    syncStringsSelected(msg.strings);
+  }
+
   if (msg.type === 'error') {
     figma.notify(msg.error.message, { timeout: 10000 })
   }

src/replace-text.ts

@@ -40,19 +40,47 @@ export const syncStrings = (airtableData: object) => {
     if (!isVar(node.name)) return
 
     let nodeHierarchy = getNodeHierarchy(node)
-    console.log(`Working on ${nodeHierarchy}...`)
 
     // If there are missing fonts, fail gracefully and move on.
     if (handleMissingFont(node, nodeHierarchy) === true) return
 
     node.autoRename = false // Don't auto-rename node on text change
 
     replaceTheText(node, nodeHierarchy, airtableData)
-
-    console.log('Done.')
   })
 }
 
+export const syncStringsSelected = (airtableData: object) => {
+  if (figma.currentPage.selection.length < 1) {
+    figma.notify('Nothing is selected!', { timeout: 10000 })
+    figma.closePlugin();
+  }
+  else {
+    var nodes: SceneNode[] = [];
+    figma.currentPage.selection.forEach(async (node: SceneNode) => {
+      if (node.type === "TEXT") {
+        nodes.push(node);
+      }
+      else {
+        nodes = nodes.concat((node as ChildrenMixin).findAll(node => node.type === "TEXT"));
+      }
+    });
+
+    nodes.forEach(async (node: TextNode) => {
+      if (!isVar(node.name)) return
+
+      let nodeHierarchy = getNodeHierarchy(node)
+
+      // If there are missing fonts, fail gracefully and move on.
+      if (handleMissingFont(node, nodeHierarchy) === true) return
+
+      node.autoRename = false // Don't auto-rename node on text change
+
+      replaceTheText(node, nodeHierarchy, airtableData)
+    })
+  }
+}
+
 const handleMissingFont = (node: TextNode, nodeHierarchy: string) => {
   if (node.hasMissingFont === true) {
     console.log(`  Node has missing fonts. Not updating.`)

src/ui.ts

@@ -64,8 +64,7 @@ onmessage = (event) => {
     formFields.lastUpdatedDate['innerHTML'] = getFieldValue(data.lastUpdatedDate)
   }
 
-  if (type === 'sync') {
-    console.log('sync called')
+  if (type === 'sync' || type === 'sync-selected') {
     const getAllStrings = async () => {
 
       let allStringsArr = await getStringsFromAirtable(msg.airtableConfig, msg.varNames)
@@ -75,7 +74,7 @@ onmessage = (event) => {
       // console.log(allStringsObj) // debug
 
       var msgToPlugin = {
-        type: 'sync-airtable-strings',
+        type: type === 'sync' ? 'sync-airtable-strings' : 'sync-airtable-strings-selected',
         strings: allStringsObj
       }
 
@@ -99,8 +98,6 @@ document.getElementById('save').onclick = () => {
   var isValid = validateForm(keys)
   // Prevent saving if form isn't valid
   if (isValid === false) return
-
-  console.log('Sending to plugin: ', keys)
   parent.postMessage({ pluginMessage: { type: 'save-airtable-config', keys } }, '*')
 }