From b71b57350f4907c331e054d91fd76ab6cd21bd02 Mon Sep 17 00:00:00 2001 From: Prorupak Date: Wed, 28 Aug 2024 21:54:14 +0545 Subject: [PATCH] feat: remove Docker, enhance DX --- docker-compose.yaml | 30 ---------------------- package.json | 5 ++++ plugin/package.json | 1 + plugin/pnpm-lock.yaml | 8 ++++++ plugin/src/code.ts | 6 ++--- plugin/src/hooks/useDebounce.ts | 2 +- plugin/src/ui/components/Login.tsx | 34 ++++++++++++++++++++----- plugin/tsconfig.json | 6 ++--- server/Dockerfile | 41 ------------------------------ 9 files changed, 48 insertions(+), 85 deletions(-) delete mode 100644 docker-compose.yaml delete mode 100644 server/Dockerfile diff --git a/docker-compose.yaml b/docker-compose.yaml deleted file mode 100644 index 5c6d278..0000000 --- a/docker-compose.yaml +++ /dev/null @@ -1,30 +0,0 @@ -version: "3" - -services: - server: - container_name: server - build: - context: . - restart: always - ports: - - 6000:6000 - networks: - - app_network - - nginx: - image: nginx:latest - container_name: nginx - volumes: - - type: bind - source: ../nginx/default.conf - target: /etc/nginx/conf.d/default.conf - ports: - - "8080:80" # Changed from 80:80 to 8080:80 to avoid conflict - depends_on: - - server - networks: - - app_network - -networks: - app_network: - external: true diff --git a/package.json b/package.json index a826de5..42dd89a 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,11 @@ "scripts": { "start-plugin": "cd plugin && pnpm watch", "start-server": "cd server && pnpm dev", + "start-server-prod": "cd server && pnpm prod", + "build-plugin": "cd plugin && pnpm build", + "build-server": "cd server && pnpm build", + "lint-plugin": "cd plugin && pnpm lint", + "lint-server": "cd server && pnpm lint", "start": "concurrently \"pnpm start-server\" \"pnpm start-plugin\"", "lint": "concurrently \"pnpm lint-server\" \"pnpm lint-plugin\"", "build": "concurrently \"pnpm build-server\" \"pnpm build-plugin\"", diff --git a/plugin/package.json b/plugin/package.json index 2d8cbad..8f3b678 100644 --- a/plugin/package.json +++ b/plugin/package.json @@ -29,6 +29,7 @@ "lint:format": "prettier --write \"src/**/*.{ts,tsx}\"" }, "dependencies": { + "@figma/plugin-typings": "^1.99.0", "react": "^16.8.6", "react-dom": "^16.8.6", "ts-loader": "^6.0.4", diff --git a/plugin/pnpm-lock.yaml b/plugin/pnpm-lock.yaml index 432ef94..5d2013d 100644 --- a/plugin/pnpm-lock.yaml +++ b/plugin/pnpm-lock.yaml @@ -8,6 +8,9 @@ importers: .: dependencies: + '@figma/plugin-typings': + specifier: ^1.99.0 + version: 1.99.0 react: specifier: ^16.8.6 version: 16.14.0 @@ -101,6 +104,9 @@ packages: resolution: {integrity: sha512-BsWiH1yFGjXXS2yvrf5LyuoSIIbPrGUWob917o+BTKuZ7qJdxX8aJLRxs1fS9n6r7vESrq1OUqb68dANcFXuQQ==} engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0} + '@figma/plugin-typings@1.99.0': + resolution: {integrity: sha512-eykvxprqZv1kDRaO+DyFSEr2FrravasOL/i8zQagjqDGCRaoxv+XwyTTSM7Vrviz1x832w4TWHJzSkXNwBUdYw==} + '@humanwhocodes/module-importer@1.0.1': resolution: {integrity: sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==} engines: {node: '>=12.22'} @@ -2465,6 +2471,8 @@ snapshots: '@eslint/object-schema@2.1.4': {} + '@figma/plugin-typings@1.99.0': {} + '@humanwhocodes/module-importer@1.0.1': {} '@humanwhocodes/retry@0.3.0': {} diff --git a/plugin/src/code.ts b/plugin/src/code.ts index 12fc584..1edd75d 100644 --- a/plugin/src/code.ts +++ b/plugin/src/code.ts @@ -1,5 +1,3 @@ -import "figma-plugin-types"; - const width = 400; const height = 500; let timer: number | ReturnType; @@ -68,7 +66,7 @@ figma.ui.onmessage = async (msg: MessageData) => { case "show": if (isShowMessage(msg)) { - const node = figma.getNodeById(msg.show); + const node = await figma.getNodeByIdAsync(msg.show); if (node?.type !== "DOCUMENT" && node?.type !== "PAGE") { figma.currentPage.selection = [node as SceneNode]; figma.viewport.scrollAndZoomIntoView([node as SceneNode]); @@ -86,7 +84,7 @@ function* walkTree(node: BaseNode): Generator { yield node; if ("children" in node) { for (const child of node.children) { - yield * walkTree(child); + yield* walkTree(child); } } } diff --git a/plugin/src/hooks/useDebounce.ts b/plugin/src/hooks/useDebounce.ts index 51fcf89..0b2905a 100644 --- a/plugin/src/hooks/useDebounce.ts +++ b/plugin/src/hooks/useDebounce.ts @@ -23,7 +23,7 @@ export function useDebounceCallback void>( callback: T, delay: number ) { - const timeoutRef = useRef(null); + const timeoutRef = useRef | null>(null); const debouncedCallback = useCallback( (...args: Parameters) => { diff --git a/plugin/src/ui/components/Login.tsx b/plugin/src/ui/components/Login.tsx index edea9b1..7111e19 100644 --- a/plugin/src/ui/components/Login.tsx +++ b/plugin/src/ui/components/Login.tsx @@ -7,6 +7,9 @@ interface LoginPageProps { } const LoginPage: React.FC = ({ loading, startOAuthFlow }) => { + const cancelLogin = () => { + parent.postMessage({ pluginMessage: { type: "quit" } }, "*"); + }; return (
= ({ loading, startOAuthFlow }) => {

Please login to start using plugin again.

- + + {loading && ( + + )} +
); diff --git a/plugin/tsconfig.json b/plugin/tsconfig.json index 76bf458..1217f9a 100644 --- a/plugin/tsconfig.json +++ b/plugin/tsconfig.json @@ -10,8 +10,8 @@ "lib": ["dom", "es2017"], "module": "commonjs", "target": "ES2015", - "jsx": "react" + "jsx": "react", + "typeRoots": ["./node_modules/@types", "./node_modules/@figma"] }, - "include": ["src/**/*.ts"], - "exclude": ["node_modules"] + "include": ["src/**/*.ts"] } diff --git a/server/Dockerfile b/server/Dockerfile deleted file mode 100644 index 54ff5af..0000000 --- a/server/Dockerfile +++ /dev/null @@ -1,41 +0,0 @@ -# Base Image -FROM node:20-slim AS base - -# Set environment variables -ENV PNPM_HOME="/pnpm" -ENV PATH="$PNPM_HOME:$PATH" - -# Install global dependencies -RUN corepack enable && corepack prepare pnpm@latest --activate && npm i -g pm2 - -WORKDIR /app - -# Copy and install dependencies -COPY package.json pnpm-lock.yaml ./ -RUN pnpm install --frozen-lockfile --prod - -# Build Stage -FROM base AS build -WORKDIR /app - -# Copy all files -COPY . . - -# Build the server -RUN pnpm build - -# Production Stage -FROM node:20-slim AS production -WORKDIR /app - -# Install pnpm again to ensure it's available in the production stage -RUN corepack enable && corepack prepare pnpm@latest --activate - -# Copy built files and necessary packages -COPY --from=build /app/dist ./dist -COPY --from=build /app/node_modules ./node_modules - -EXPOSE 6000 - -# Start the server in production mode -CMD ["pnpm", "start-server-prod"]