Merge branch 'master' into s3

Author: bunsenstraat

apps/remix-ide/src/app/panels/file-panel.js

@@ -314,6 +314,7 @@ export default class Filepanel extends ViewPlugin {
     if (workspace.name !== ' - connect to localhost - ') {
       localStorage.setItem('currentWorkspace', workspace.name)
     }
+    console.log('setting workspace', workspace)
     this.emit('setWorkspace', workspace)
   }
 

apps/remix-ide/src/app/plugins/ai-dapp-generator.ts

@@ -194,6 +194,12 @@ export class AIDappGenerator extends Plugin {
 
       if (Object.keys(pages).length === 0) {
         console.error('[DEBUG-AI] ❌ CRITICAL: parsePages returned empty object!');
+        console.error('[DEBUG-AI] Raw response length:', htmlContent?.length);
+        console.error('[DEBUG-AI] First 500 chars:', htmlContent?.substring(0, 500));
+        console.error('[DEBUG-AI] Contains START_TITLE?', htmlContent?.includes('START_TITLE'));
+        console.error('[DEBUG-AI] Contains <<<:', htmlContent?.includes('<<<'));
+        const debugMatches = htmlContent?.match(/<{3,}\s*START_TITLE\s+(.*?)\s+>{3,}/g);
+        console.error('[DEBUG-AI] Marker matches found:', debugMatches?.length || 0, debugMatches);
         throw new Error("AI generated empty content. Please try again.");
       }
 
@@ -504,7 +510,7 @@ const ensureCompleteHtml = (html: string): string => {
 
 const parsePages = (content: string) => {
   const pages: Record<string, string> = {}
-  const markerRegex = /<{3,}\s*START_TITLE\s+(.*?)\s+>{3,}\s*END_TITLE/g
+  const markerRegex = /<{3,}\s*START_TITLE\s+(.*?)\s+>{3,}(?:\s*END_TITLE)?/g
 
   const parts = content.split(markerRegex)
 

apps/remix-ide/src/app/plugins/auth-plugin.tsx

@@ -7,8 +7,8 @@ const profile = {
   name: 'auth',
   displayName: 'Authentication',
   description: 'Handles SSO authentication and credits',
-  methods: ['login', 'logout', 'getUser', 'getCredits', 'refreshCredits', 'linkAccount', 'getLinkedAccounts', 'unlinkAccount', 'getApiClient', 'getSSOApi', 'getCreditsApi', 'getPermissionsApi', 'getBillingApi', 'checkPermission', 'hasPermission', 'getAllPermissions', 'checkPermissions', 'getFeaturesByCategory', 'getFeatureLimit', 'getPaddleConfig', 'getToken', 'isAuthenticated', 'getInviteApi', 'validateInviteToken', 'redeemInviteToken', 'getPendingInviteToken', 'setPendingInviteToken', 'setPendingInviteValidation', 'clearPendingInviteToken', 'getPendingInviteValidation'],
-  events: ['authStateChanged', 'creditsUpdated', 'accountLinked', 'tokenRefreshed', 'inviteTokenDetected', 'inviteTokenRedeemed']
+  methods: ['login', 'logout', 'getUser', 'getCredits', 'refreshCredits', 'linkAccount', 'getLinkedAccounts', 'unlinkAccount', 'getApiClient', 'getSSOApi', 'getCreditsApi', 'getPermissionsApi', 'getBillingApi', 'checkPermission', 'hasPermission', 'getAllPermissions', 'checkPermissions', 'getFeaturesByCategory', 'getFeatureLimit', 'getPaddleConfig', 'fetchGitHubToken', 'disconnectGitHub', 'getInviteApi', 'validateInviteToken', 'redeemInviteToken', 'getPendingInviteToken', 'setPendingInviteToken', 'setPendingInviteValidation', 'clearPendingInviteToken', 'getPendingInviteValidation', 'isAuthenticated', 'getToken'],
+  events: ['authStateChanged', 'creditsUpdated', 'accountLinked', 'gitHubTokenReady', 'inviteTokenDetected', 'inviteTokenRedeemed']
 }
 
 export class AuthPlugin extends Plugin {
@@ -276,7 +276,7 @@ export class AuthPlugin extends Plugin {
       }
 
       // Wait for message from popup
-      const result = await new Promise<{ user: AuthUser; accessToken: string; refreshToken: string }>((resolve, reject) => {
+      const result = await new Promise<{ user: AuthUser; accessToken: string; refreshToken: string; providerToken?: string }>((resolve, reject) => {
         const timeout = setTimeout(() => {
           cleanup()
           reject(new Error('Login timeout'))
@@ -291,20 +291,22 @@ export class AuthPlugin extends Plugin {
         }, 500) // Check every 500ms
 
         const handleMessage = (event: MessageEvent) => {
+          console.log('[AuthPlugin] Received message event:', event)
           // Verify origin
           if (event.origin !== new URL(endpointUrls.sso).origin) {
             return
           }
 
           if (event.data.type === 'sso-auth-success') {
             console.log('[AuthPlugin] Received auth success from popup')
-            console.log('[AuthPlugin] User data from popup:', event.data.user)
+            console.log('[AuthPlugin] User data from popup:', event.data)
             console.log('[AuthPlugin] User provider field:', event.data.user?.provider)
             cleanup()
             resolve({
               user: event.data.user,
               accessToken: event.data.accessToken,
-              refreshToken: event.data.refreshToken
+              refreshToken: event.data.refreshToken,
+              providerToken: event.data.providerToken
             })
           } else if (event.data.type === 'sso-auth-error') {
             cleanup()
@@ -325,6 +327,7 @@ export class AuthPlugin extends Plugin {
       })
 
       // Store tokens in localStorage
+      console.log(result)
       console.log('[AuthPlugin] Storing user in localStorage:', result.user)
       console.log('[AuthPlugin] User has provider field:', result.user.provider)
       localStorage.setItem('remix_access_token', result.accessToken)
@@ -342,6 +345,12 @@ export class AuthPlugin extends Plugin {
         token: result.accessToken
       })
 
+      // If logged in via GitHub, bridge the provider token to dgit config
+      if (result.user.provider === 'github' && result.providerToken) {
+        console.log('[AuthPlugin] GitHub provider detected, bridging token to dgit')
+        await this.bridgeGitHubToken(result.providerToken)
+      }
+
       // Fetch credits after successful login
       this.refreshCredits().catch(console.error)
 
@@ -409,7 +418,7 @@ export class AuthPlugin extends Plugin {
       }
 
       // Wait for message from popup
-      const result = await new Promise<{ user: AuthUser; accessToken: string }>((resolve, reject) => {
+      const result = await new Promise<{ user: AuthUser; accessToken: string; providerToken?: string }>((resolve, reject) => {
         const timeout = setTimeout(() => {
           cleanup()
           reject(new Error('Account linking timeout'))
@@ -477,12 +486,81 @@ export class AuthPlugin extends Plugin {
       localStorage.setItem('remix_access_token', currentToken)
       localStorage.setItem('remix_user', JSON.stringify(currentUser))
 
+      // If linking GitHub, bridge the provider token to dgit config
+      if (provider === 'github' && result.providerToken) {
+        console.log('[AuthPlugin] GitHub linked, bridging token to dgit')
+        await this.bridgeGitHubToken(result.providerToken)
+      }
+
     } catch (error: any) {
       console.error('[AuthPlugin] Account linking failed:', error)
       throw error
     }
   }
 
+  /**
+   * Bridge a GitHub OAuth token to the dgit plugin config.
+   * Saves the token and emits an event so git listeners can update state.
+   */
+  private async bridgeGitHubToken(token: string): Promise<void> {
+    try {
+      await this.call('config' as any, 'setAppParameter', 'settings/gist-access-token', token)
+      this.emit('gitHubTokenReady' as any, { token })
+      console.log('[AuthPlugin] GitHub token bridged to dgit config')
+    } catch (error) {
+      console.error('[AuthPlugin] Failed to bridge GitHub token:', error)
+    }
+  }
+
+  /**
+   * Fetch the stored GitHub OAuth token from the SSO backend.
+   * Use this when a non-GitHub SSO user links GitHub later,
+   * or to re-fetch after session restore.
+   */
+  async fetchGitHubToken(): Promise<string | null> {
+    try {
+      const token = await this.getToken()
+      if (!token) return null
+
+      const response = await fetch(`${endpointUrls.sso}/accounts/github/token`, {
+        headers: {
+          'Authorization': `Bearer ${token}`,
+          'Accept': 'application/json'
+        },
+        credentials: 'include'
+      })
+
+      if (!response.ok) {
+        console.log('[AuthPlugin] No GitHub token available from backend:', response.status)
+        return null
+      }
+
+      const data = await response.json()
+      if (data.access_token) {
+        await this.bridgeGitHubToken(data.access_token)
+        return data.access_token
+      }
+      return null
+    } catch (error) {
+      console.error('[AuthPlugin] Failed to fetch GitHub token:', error)
+      return null
+    }
+  }
+
+  /**
+   * Disconnect GitHub from dgit. Clears the stored GitHub token
+   * but does NOT affect SSO login state.
+   */
+  async disconnectGitHub(): Promise<void> {
+    try {
+      await this.call('config' as any, 'setAppParameter', 'settings/gist-access-token', '')
+      this.emit('gitHubTokenReady' as any, { token: null })
+      console.log('[AuthPlugin] GitHub disconnected from dgit')
+    } catch (error) {
+      console.error('[AuthPlugin] Failed to disconnect GitHub:', error)
+    }
+  }
+
   async getUser(): Promise<AuthUser | null> {
     try {
       const userStr = localStorage.getItem('remix_user')

apps/remix-ide/src/app/plugins/prompt-blocks.ts

@@ -140,7 +140,8 @@ export const invariants = {
 3. **ALWAYS import React from 'react'** in any file using JSX (especially \`src/main.jsx\` and \`src/App.jsx\`).
    - Example: \`import React from 'react';\` must be at the top, even if you use \`createRoot\`.
 4. **ETHERS.JS PROVIDER RULES (CRITICAL):**
-   - **MUST USE:** Always use \`new ethers.BrowserProvider(window.ethereum)\` for both reading and writing.
+   - **MUST USE:** Always use \`ethers.BrowserProvider\` with a wallet provider for both reading and writing.
+   - **PROVIDER ACQUISITION:** Use \`window.__qdapp_getProvider ? await window.__qdapp_getProvider() : window.ethereum\` to get the provider. Store this raw provider in a ref/variable for reuse (e.g. network switching).
    - **FORBIDDEN:** NEVER use \`new ethers.JsonRpcProvider\`, \`InfuraProvider\`, or \`AlchemyProvider\`.
    - **FORBIDDEN:** NEVER generate code containing placeholders like 'YOUR_INFURA_KEY' or ask for API keys.
 4. Use React with JSX syntax (not "text/babel" scripts).
@@ -196,7 +197,9 @@ ${functionNames}
   },
 
   /** Wallet connection and network switching patterns */
-  wallet: (): string => `
+  wallet: (isLocalVM: boolean = false): string => {
+    if (isLocalVM) {
+      return `
 **WALLET CONNECTION RULES:**
 1. **Connect Wallet** button must be visible when disconnected.
 2. Check \`window.ethereum\` existence before any wallet operations.
@@ -222,15 +225,97 @@ const switchNetwork = async (targetChainHex) => {
   }
 };
 \`\`\`
-`,
+`
+    }
+
+    // Real network: full wallet selection rules with disconnect/switch/localStorage
+    return `
+**WALLET CONNECTION RULES:**
+1. **Connect Wallet** button must be visible in the header/navbar when disconnected.
+2. **Disconnect Wallet** button must be visible in the header/navbar when connected (next to the account address).
+3. **Switch Network** button must appear **only when** the connected wallet's chain ID differs from the DApp's target chain ID. Hide it when on the correct network.
+4. Use loading spinners for async actions.
+5. Handle "User rejected request" errors gracefully.
+6. Show truncated wallet address (e.g. \`0x1234...5678\`) when connected.
+
+**WALLET PROVIDER ACQUISITION (CRITICAL):**
+The deployed DApp uses \`window.__qdapp_getProvider()\` to discover and select wallets via EIP-6963.
+Always get the raw provider like this:
+\`\`\`javascript
+const rawProvider = window.__qdapp_getProvider
+  ? await window.__qdapp_getProvider()
+  : window.ethereum;
+if (!rawProvider) {
+  alert('Please install a Web3 wallet (e.g. MetaMask).');
+  return;
+}
+const provider = new ethers.BrowserProvider(rawProvider);
+\`\`\`
+**Store \`rawProvider\` in a React ref** (e.g. \`rawProviderRef.current = rawProvider\`) so you can reuse it for network switching without calling \`__qdapp_getProvider\` again.
+
+**🚨 CHAIN ID COMPARISON (CRITICAL — prevents wrong-network false positive):**
+- ethers.js v6 returns \`network.chainId\` as a **BigInt** (e.g. \`11155111n\`).
+- **NEVER compare hex strings directly** (e.g. \`"0xaa36a7" !== "aa36a7"\` — prefix mismatch!).
+- **ALWAYS compare as decimal numbers:**
+\`\`\`javascript
+const TARGET_CHAIN_ID = 11155111; // Sepolia — use DECIMAL number
+// After connecting:
+const network = await provider.getNetwork();
+const currentChainId = Number(network.chainId);
+setChainId(currentChainId);
+// Wrong network check:
+const isWrongNetwork = account && chainId !== null && chainId !== TARGET_CHAIN_ID;
+\`\`\`
+- For \`wallet_switchEthereumChain\`, convert to hex: \`'0x' + TARGET_CHAIN_ID.toString(16)\`
+
+**Disconnect Pattern (mandatory — MUST implement this):**
+\`\`\`javascript
+const disconnectWallet = () => {
+  setAccount(null);
+  setProvider(null);
+  setSigner(null);
+  rawProviderRef.current = null;
+  // Clear saved wallet preference for wallet selection
+  try { localStorage.removeItem('__qdapp_wallet_rdns'); } catch(e) {}
+};
+\`\`\`
+The Disconnect button should be placed in the navbar/header, visible when connected.
+When disconnected, the DApp should return to the initial "Connect Wallet" state.
+
+**Network Switch Pattern (mandatory — MUST be a visible button):**
+Use the stored \`rawProviderRef.current\` for network operations:
+\`\`\`javascript
+const switchNetwork = async (targetChainHex) => {
+  const rp = rawProviderRef.current;
+  if (!rp) return;
+  try {
+    await rp.request({
+      method: 'wallet_switchEthereumChain',
+      params: [{ chainId: targetChainHex }],
+    });
+  } catch (switchError) {
+    if (switchError.code === 4902) {
+      await rp.request({ method: 'wallet_addEthereumChain', params: [...] });
+    } else {
+      throw switchError;
+    }
+  }
+};
+\`\`\`
+Show a **"Switch to [Network Name]"** button when the user is on the wrong chain.
+`
+  },
 
   /** Ethers.js v6 specific rules */
   ethersRules: (): string => `
 **ETHERS.JS v6 RULES (CRITICAL):**
 - **Read-Only:** For 'view'/'pure' functions, use \`new ethers.Contract(addr, abi, provider)\`.
 - **Write (Transaction):** For 'nonpayable'/'payable' functions, YOU MUST USE A SIGNER:
   \`\`\`javascript
-  const provider = new ethers.BrowserProvider(window.ethereum);
+  const rawProvider = window.__qdapp_getProvider
+    ? await window.__qdapp_getProvider()
+    : window.ethereum;
+  const provider = new ethers.BrowserProvider(rawProvider);
   const signer = await provider.getSigner();
   const contractWithSigner = new ethers.Contract(address, abi, signer);
   const tx = await contractWithSigner.functionName(args);
@@ -533,7 +618,7 @@ export const buildSystemPrompt = (ctx: PromptContext): string => {
     invariants.truncationPrevention(),
     // Layer 1
     blockchain.ethersRules(),
-    blockchain.wallet(),
+    blockchain.wallet(!!ctx.isLocalVM),
     blockchain.networkContext(ctx.contract.chainId, !!ctx.isLocalVM),
     // Layer 2
     ctx.isBaseMiniApp ? platform.baseMiniApp() : '',