Cleanup and wait spiny thing

.env.example

@@ -37,5 +37,6 @@ POLYGONSCAN_API_KEY=
 BSCSCAN_API_KEY=
 
 # Figma App for OAuth
+# Create these here: https://www.figma.com/developers/apps
 FIGMA_CLIENT_ID=
 FIGMA_CLIENT_SECRET=

app/api/auth/figma/callback/route.ts

@@ -8,11 +8,20 @@ export async function GET(request: NextRequest) {
     const { searchParams } = new URL(request.url);
     const { FIGMA_CLIENT_ID, FIGMA_CLIENT_SECRET, NEXT_PUBLIC_HOST } = process.env;
 
+    // biome-ignore lint/complexity/useSimplifiedLogicExpression: <explanation>
+    if (!FIGMA_CLIENT_ID || !FIGMA_CLIENT_SECRET || !NEXT_PUBLIC_HOST) {
+        return NextResponse.json({ error: 'Missing environment variables' }, { status: 500 });
+    }
+
     // Retrieve the stored state from the cookie and verify the CSRF token
     const stateParam = searchParams.get('state');
     const storedState = request.cookies.get('oauth_state')?.value;
+    // biome-ignore lint/complexity/useSimplifiedLogicExpression: <explanation>
+    if (!stateParam || !storedState) {
+        return NextResponse.json({ error: 'Missing state parameter' }, { status: 500 });
+    }
     if (storedState !== stateParam) {
-        return NextResponse.json({ error: 'State mismatch. Possible CSRF attack.' }, { status: 400 });
+        return NextResponse.json({ error: 'State mismatch. Possible CSRF attack.' }, { status: 500 });
     }
 
     // Get the original page URL from the state

app/api/auth/figma/signin/route.ts

@@ -7,9 +7,19 @@ import { type NextRequest, NextResponse } from 'next/server';
 export async function GET(request: NextRequest) {
     const { FIGMA_CLIENT_ID, NEXT_PUBLIC_HOST } = process.env;
 
+    // biome-ignore lint/complexity/useSimplifiedLogicExpression: <explanation>
+    if (!FIGMA_CLIENT_ID || !NEXT_PUBLIC_HOST) {
+        return NextResponse.json({ error: 'Missing environment variables' }, { status: 500 });
+    }
+
     // Get the original page URL from query params or referrer header
     const originalUrl = request.nextUrl.searchParams.get('original_url');
 
+    // URL redirection attacks
+    if (!originalUrl?.startsWith(NEXT_PUBLIC_HOST)) {
+        return NextResponse.json({ error: 'Invalid redirect URL' }, { status: 400 });
+    }
+
     const redirectUri = `${NEXT_PUBLIC_HOST}/api/auth/figma/callback`;
     const state = JSON.stringify({
         csrfToken: Math.random().toString(36).substring(2),

templates/figma/Config.ts

@@ -1,7 +1,6 @@
 import type { FigmaTextLayer } from './utils/FigmaApi'
 
 export interface FramePressConfig {
-    figmaPAT: string
     slides: SlideConfig[]
     nextSlideId: number
 }

templates/figma/components/FigmaConnector.tsx

@@ -2,29 +2,39 @@
 import { Button } from '@/sdk/components';
 import { useFigmaToken } from './FigmaTokenContext';
 import { useRouter } from 'next/navigation';
+import { useState } from 'react';
 
-export default function FigmaTokenEditor() {
+export default function FigmaConnector() {
   const router = useRouter();
   const { figmaAccessToken, loading } = useFigmaToken();
+  const [isConnecting, setIsConnecting] = useState(false); // To track connection state
 
   const handleConnectFigma = () => {
+    setIsConnecting(true); // Set connecting state
+
+    // Change cursor to 'wait'
+    document.body.style.cursor = 'wait';
+
     const currentPage = window.location.href;
     router.push(`/api/auth/figma/signin?original_url=${encodeURIComponent(currentPage)}`);
   };
 
   const handleSignout = async () => {
+    // Change cursor to 'wait'
+    document.body.style.cursor = 'wait';
+
     await fetch('/api/auth/figma/signout', {
       method: 'POST'
     });
 
     // Refresh the page
-    // biome-ignore lint/correctness/noSelfAssign: <explanation>
+    // biome-ignore lint/correctness/noSelfAssign: this is legit
     window.location.href = window.location.href;
   };
 
   return (
     <div>
-      {loading ? (
+      {loading || isConnecting ? (
         <p>Loading...</p>
       ) : !figmaAccessToken ? (
         <Button onClick={handleConnectFigma} variant="primary">

templates/figma/components/PropertiesTab.tsx

@@ -13,8 +13,6 @@ import type {
     TextLayerConfigs,
 } from '../Config'
 import { getFigmaDesign, svgToDataUrl } from '../utils/FigmaApi'
-import { useSession } from 'next-auth/react'
-import type { FrameTrainSession } from '@/auth'
 import { useFigmaToken } from './FigmaTokenContext'
 
 const SVG_TEXT_DEBUG_ENABLED = false

templates/figma/utils/FigmaApi.ts

@@ -118,15 +118,15 @@ export type FigmaFile = {
  *
  */
 export async function getFigmaDesign(
-    figmaPAT: string,
+    figmaAccessToken: string,
     linkUrl?: string
 ): Promise<FigmaApiResult<FigmaDesign>> {
     try {
-        const fileResult = await getFigmaFile(figmaPAT, linkUrl)
+        const fileResult = await getFigmaFile(figmaAccessToken, linkUrl)
         if (!fileResult.success) return fileResult
         const file = fileResult.value
 
-        const svgResult = await getFigmaSvgImage(figmaPAT, linkUrl)
+        const svgResult = await getFigmaSvgImage(figmaAccessToken, linkUrl)
         if (!svgResult.success) return svgResult
         const svg = svgResult.value
 

templates/figma/utils/FigmaFrameBuilder.ts

@@ -51,7 +51,7 @@ export default async function buildFigmaFrame(
 
     function createView(): [ReactElement, FontConfig[]] {
         // biome-ignore lint/complexity/useSimplifiedLogicExpression: horrible advice
-        if (!config.figmaPAT || !slideConfig || !slideConfig.figmaUrl)
+        if (!slideConfig || !slideConfig.figmaUrl)
             return [NoFigmaView(), []]
 
         const view = FigmaView({ slideConfig })