2837 20 unable to create variable collections from sets

packages/tokens-studio-for-figma/src/plugin/createLocalVariablesWithoutModesInPlugin.test.ts

@@ -0,0 +1,64 @@
+import { mockCreateVariableCollection, mockGetLocalVariableCollections } from '../../tests/__mocks__/figmaMock';
+import { TokenSetStatus } from '@/constants/TokenSetStatus';
+import { TokenTypes } from '@/constants/TokenTypes';
+import createLocalVariablesWithoutModesInPlugin from './createLocalVariablesWithoutModesInPlugin';
+import { SingleToken } from '@/types/tokens';
+import { SettingsState } from '@/app/store/models/settings';
+
+describe('createLocalVariablesWithoutModesInPlugin', () => {
+  const mockRenameMode = jest.fn();
+
+  const tokens = {
+    global: [
+      {
+        name: 'button.primary.borderRadius',
+        value: '8',
+        type: TokenTypes.BORDER_RADIUS,
+      } as SingleToken,
+      {
+        name: 'button.primary.width',
+        value: '16',
+        type: TokenTypes.SIZING,
+      } as SingleToken,
+    ],
+  };
+  const settings = {
+    baseFontSize: '16',
+  } as SettingsState;
+
+  it('when there is no collection which correspond to the theme, then we create a new collection', async () => {
+    const mockLocalVariableCollections = [
+      {
+        id: 'VariableCollectionId:334:16746',
+        modes: [
+          {
+            name: 'light',
+            modeId: '123',
+          },
+        ],
+        name: 'core',
+      },
+    ];
+    const mockNewCollection = {
+      id: 'VariableCollectionId:334:16723',
+      modes: [
+        {
+          name: 'new Mode',
+          modeId: '123',
+        },
+      ],
+      name: 'color',
+      renameMode: mockRenameMode,
+    } as unknown as VariableCollection;
+    mockGetLocalVariableCollections.mockImplementationOnce(() => mockLocalVariableCollections);
+    mockCreateVariableCollection.mockImplementationOnce(() => mockNewCollection);
+    const selectedSets = [{
+      set: 'global',
+      status: TokenSetStatus.ENABLED,
+    }]
+    expect(await createLocalVariablesWithoutModesInPlugin(tokens, settings, selectedSets)).toEqual({
+      allVariableCollectionIds: {},
+      totalVariables: 0,
+    });
+  });
+});

packages/tokens-studio-for-figma/src/plugin/createLocalVariablesWithoutModesInPlugin.ts

@@ -30,6 +30,18 @@ export default async function createLocalVariablesWithoutModesInPlugin(tokens: R
 
   const checkSetting = !settings.variablesBoolean && !settings.variablesColor && !settings.variablesNumber && !settings.variablesString;
   if (!checkSetting) {
+    const themesToCreateCollections = selectedSets.reduce((acc: ThemeObject[], curr: ExportTokenSet) => {
+      if (curr.status === TokenSetStatus.ENABLED) {
+        acc.push({
+          selectedTokenSets: {
+            [curr.set]: curr.status,
+          },
+          id: curr.set,
+          name: curr.set
+        })
+      }
+      return acc;
+    }, [] as ThemeObject[]);
     const themeContainer = selectedSets.reduce((acc: ThemeObject, curr: ExportTokenSet) => {
       acc.selectedTokenSets = {
         ...acc.selectedTokenSets,
@@ -39,12 +51,19 @@ export default async function createLocalVariablesWithoutModesInPlugin(tokens: R
     }, {} as ThemeObject);
     const selectedSetIds = selectedSets.map((set) => set.set);
 
-    const collections = await createNecessaryVariableCollections([themeContainer], selectedSetIds);
+    const collections = await createNecessaryVariableCollections(themesToCreateCollections, selectedSetIds);
+
+    const sourceSets = selectedSets.filter((t) => t.status === TokenSetStatus.SOURCE);
+    const sourceTokenSets = sourceSets.reduce((acc, curr) => {
+      acc[curr.set] = tokens[curr.set];
+      return acc;
+    }, {});
 
     await Promise.all(selectedSets.map(async (set: ExportTokenSet, index) => {
       if (set.status === TokenSetStatus.ENABLED) {
         const setTokens: Record<string, AnyTokenList> = {
-          [set.set]: tokens[set.set],
+          ...sourceTokenSets,
+          [set.set]: tokens[set.set]
         };
         const { collection, modeId } = findCollectionAndModeIdForTheme(set.set, set.set, collections);