Skip to content

Commit f5f2fda

Browse files
mattnoltingmattnolting
committed
feat(code-connect-urls): udpated dependecies
1 parent e29fe06 commit f5f2fda

File tree

6 files changed

+231
-27
lines changed

6 files changed

+231
-27
lines changed

‎packages/react-core/codeConnect/components/AboutModal.figma.tsx

Lines changed: 16 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,18 @@
1-
import React from "react"
2-
import { AboutModal } from "./AboutModal"
3-
import figma from "@figma/code-connect"
1+
// import React from 'react';
2+
// import { AboutModal } from './AboutModal';
3+
// import figma from '@figma/code-connect';
44

5-
/**
6-
* -- This file was auto-generated by Code Connect --
7-
* `props` includes a mapping from Figma properties and variants to
8-
* suggested values. You should update this to match the props of your
9-
* code component, and update the `example` function to return the
10-
* code example you'd like to see in Figma
11-
*/
5+
// /**
6+
// * -- This file was auto-generated by Code Connect --
7+
// * `props` includes a mapping from Figma properties and variants to
8+
// * suggested values. You should update this to match the props of your
9+
// * code component, and update the `example` function to return the
10+
// * code example you'd like to see in Figma
11+
// */
1212

13-
figma.connect(
14-
AboutModal,
15-
"[object Object]2879-13973",
16-
{
17-
props: {
18-
productName: figma.string("Product name"),
19-
},
20-
example: (props) => <AboutModal />,
21-
},
22-
)
13+
// figma.connect(AboutModal, '[object Object]2879-13973', {
14+
// props: {
15+
// productName: figma.string('Product name')
16+
// },
17+
// example: (props) => <AboutModal />
18+
// });

‎packages/react-core/codeConnect/config.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
{
22
"figmaBaseUrl": "https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/branch/H3LonYnwH26v9zNEa2SXFk/PatternFly-6%3A-Components",
33
"defaultNodeId": "1-196"
4-
}
4+
}

‎packages/react-core/codeConnect/scripts/figma-url-fixer.mjs

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
/* eslint-disable no-console */
2+
import fs from 'fs/promises';
3+
import { glob } from 'glob';
4+
import figmaBaseUrl from '../config.json' assert { type: 'json' };
5+
6+
/**
7+
* Process a single file to fix Figma URLs with detailed debugging
8+
*/
9+
export async function processFigmaFile(filePath) {
10+
try {
11+
console.log(`\nProcessing file: ${filePath}`);
12+
const content = await fs.readFile(filePath, 'utf8');
13+
let modified = false;
14+
15+
// Find all figma.connect calls with string literals as second parameter
16+
// Updated regex to be more flexible with whitespace and formatting
17+
const figmaConnectRegex = /figma\.connect\(\s*[^,]+,\s*(['"])([^'"]+)\1/g;
18+
let match;
19+
let matchCount = 0;
20+
21+
// Test the content for any figma.connect calls
22+
const hasConnect = content.includes('figma.connect');
23+
console.log(`Contains figma.connect calls: ${hasConnect}`);
24+
25+
if (!hasConnect) {
26+
return false;
27+
}
28+
29+
// Process all matches
30+
while ((match = figmaConnectRegex.exec(content)) !== null) {
31+
matchCount++;
32+
const [fullMatch, quotes, url] = match;
33+
console.log(`\nMatch #${matchCount} found: ${fullMatch}`);
34+
console.log(`URL extracted: ${url}`);
35+
36+
// Only process if the URL doesn't already have the correct root
37+
const needsUpdate = !url.startsWith(figmaBaseUrl);
38+
console.log(`URL needs update: ${needsUpdate}`);
39+
40+
if (needsUpdate) {
41+
// Extract node ID from current URL
42+
let nodeId = null;
43+
44+
// Try to extract from node-id parameter
45+
const nodeIdMatch = url.match(/node-id=([^&]+)/);
46+
if (nodeIdMatch) {
47+
nodeId = nodeIdMatch[1];
48+
console.log(`Found node-id in URL parameter: ${nodeId}`);
49+
} else {
50+
// Try to extract from end of URL (format: digits-digits)
51+
const pathParts = url.split('/');
52+
const lastPart = pathParts[pathParts.length - 1];
53+
if (/^\d+-\d+$/.test(lastPart)) {
54+
nodeId = lastPart;
55+
console.log(`Found node-id at end of URL: ${nodeId}`);
56+
}
57+
}
58+
59+
// Only update if we successfully extracted a node ID
60+
if (nodeId) {
61+
const newUrl = `${figmaBaseUrl}${nodeId}`;
62+
console.log(`New URL will be: ${newUrl}`);
63+
64+
// Create new content by replacing the old URL with the new one
65+
const updatedContent = content.replace(fullMatch, fullMatch.replace(url, newUrl));
66+
67+
// Check if replacement actually changed anything
68+
if (updatedContent !== content) {
69+
console.log(`Successfully updated URL in content`);
70+
await fs.writeFile(filePath, updatedContent, 'utf8');
71+
console.log(`Updated file: ${filePath}`);
72+
modified = true;
73+
} else {
74+
console.log(`Warning: Replacement had no effect on content`);
75+
}
76+
} else {
77+
console.log(`Could not extract node ID from URL: ${url}`);
78+
}
79+
}
80+
}
81+
82+
console.log(`Total matches found: ${matchCount}`);
83+
return modified;
84+
} catch (error) {
85+
console.error(`Error processing ${filePath}:`, error);
86+
return false;
87+
}
88+
}
89+
90+
// Simple test function that processes one file
91+
export async function testProcessFile(filePath) {
92+
console.log('Running test on file:', filePath);
93+
const result = await processFigmaFile(filePath);
94+
console.log('Processing result:', result);
95+
}
96+
97+
// If this file is run directly, execute the fix
98+
if (import.meta.url === `file://${process.argv[1]}`) {
99+
const testFile = process.argv[2];
100+
101+
if (testFile) {
102+
// Test a specific file if provided
103+
testProcessFile(testFile);
104+
} else {
105+
// Otherwise, find and process all files
106+
console.log('Finding all .figma.tsx files...');
107+
glob('**/*.figma.tsx', {
108+
ignore: ['**/node_modules/**', '**/dist/**']
109+
}).then((files) => {
110+
console.log(`Found ${files.length} files to process`);
111+
if (files.length > 0) {
112+
testProcessFile(files[0]); // Test with the first file found
113+
}
114+
});
115+
}
116+
}

‎packages/react-core/codeConnect/scripts/figma-url-watcher.mjs

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
/* eslint-disable no-console */
2+
import { glob } from 'glob';
3+
import chokidar from 'chokidar';
4+
import { processFigmaFile } from './figma-url-fixer.mjs';
5+
import figmaBaseUrl from '../config.json' assert { type: 'json' };
6+
7+
// Figma file watcher function
8+
async function figmaFileWather() {
9+
console.log('Starting Figma URL watcher...');
10+
console.log('Current directory:', process.cwd());
11+
console.log('Using root URL:', figmaBaseUrl);
12+
13+
// Find all .figma.tsx files directly using glob
14+
const files = await glob('**/*.figma.tsx', {
15+
ignore: ['**/node_modules/**', '**/dist/**', 'codeConnect/tests/**/*'],
16+
absolute: true // Get absolute paths
17+
});
18+
19+
console.log(`Found ${files.length} .figma.tsx files in the project:`);
20+
21+
if (files.length === 0) {
22+
console.log('No .figma.tsx files found. Please check your project structure.');
23+
return;
24+
}
25+
26+
// Log found files
27+
files.forEach((file) => console.log(` - ${file}`));
28+
29+
// Process all files first
30+
let fixedCount = 0;
31+
for (const file of files) {
32+
try {
33+
const wasFixed = await processFigmaFile(file);
34+
if (wasFixed) {
35+
fixedCount++;
36+
}
37+
} catch (error) {
38+
console.error(`Error processing ${file}:`, error.message);
39+
}
40+
}
41+
42+
console.log(`Initial processing complete. Fixed ${fixedCount} files.`);
43+
44+
// Now set up watcher for these specific files
45+
const watcher = chokidar.watch(files, {
46+
persistent: true,
47+
ignoreInitial: true, // We already processed them
48+
awaitWriteFinish: {
49+
stabilityThreshold: 300,
50+
pollInterval: 100
51+
}
52+
});
53+
54+
// Simple file handler
55+
const handleFile = async (filePath) => {
56+
console.log(`File changed: ${filePath}`);
57+
try {
58+
await processFigmaFile(filePath);
59+
} catch (error) {
60+
console.error(`Error processing ${filePath}:`, error.message);
61+
}
62+
};
63+
64+
// Set up event handlers
65+
watcher
66+
.on('change', handleFile)
67+
.on('ready', () => {
68+
console.log('Watcher ready. Monitoring these files for changes:');
69+
files.forEach((file) => console.log(` - ${file}`));
70+
})
71+
.on('error', (error) => console.error(`Watcher error:`, error));
72+
73+
console.log('Watcher started. Press Ctrl+C to stop.');
74+
}
75+
76+
// Run the figmaFileWather function
77+
figmaFileWather().catch((error) => {
78+
console.error('Fatal error:', error);
79+
});

‎packages/react-core/figma.config.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,4 +30,4 @@
3030
}
3131
}
3232
}
33-
}
33+
}

‎packages/react-core/package.json

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
{
22
"name": "@patternfly/react-core",
3-
"version": "6.2.0-prerelease.34",
3+
"version": "6.2.1",
44
"description": "This library provides a set of common React components for use with the PatternFly reference implementation.",
55
"main": "dist/js/index.js",
6+
"type": "module",
67
"module": "dist/esm/index.js",
78
"types": "dist/esm/index.d.ts",
89
"typesVersions": {
@@ -38,25 +39,37 @@
3839
"url": "https://github.com/patternfly/patternfly-react/issues"
3940
},
4041
"homepage": "https://github.com/patternfly/patternfly-react#readme",
42+
"exports": {
43+
".": {
44+
"import": "./index.js",
45+
"require": "./index.js"
46+
},
47+
"./icons": {
48+
"import": "./icons/index.js",
49+
"require": "./icons/index.js"
50+
}
51+
},
4152
"scripts": {
42-
"build:umd": "rollup -c --environment IS_PRODUCTION",
4353
"build:single:packages": "node ../../scripts/build-single-packages.mjs --config single-packages.config.json",
4454
"clean": "rimraf dist components layouts helpers next deprecated",
45-
"generate": "node scripts/copyStyles.mjs",
46-
"subpaths": "node ../../scripts/exportSubpaths.mjs --config subpaths.config.json",
4755
"figma:watchUrls": "node codeConnect/scripts/figma-url-watcher.mjs",
4856
"figma:fixUrls": "node codeConnect/scripts/figma-url-fixer.mjs"
4957
},
5058
"dependencies": {
59+
"-": "^0.0.1",
5160
"@patternfly/react-icons": "workspace:^",
5261
"@patternfly/react-styles": "workspace:^",
5362
"@patternfly/react-tokens": "workspace:^",
63+
"@types/glob": "^8.1.0",
64+
"@types/node": "^22.13.5",
5465
"focus-trap": "7.6.4",
66+
"react": "^18.2.0",
67+
"react-dom": "^18.2.0",
5568
"react-dropzone": "^14.3.5",
5669
"tslib": "^2.8.1"
5770
},
5871
"devDependencies": {
59-
"@patternfly/patternfly": "6.2.0-prerelease.25",
72+
"@figma/code-connect": "^1.3.1",
6073
"case-anything": "^3.1.2",
6174
"css": "^3.0.0",
6275
"fs-extra": "^11.3.0"

0 commit comments

Comments
 (0)