groove-dev 0.27.103 → 0.27.106

package/packages/gui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@groove-dev/gui",
-  "version": "0.27.103",
+  "version": "0.27.106",
   "description": "GROOVE GUI — visual agent control plane",
   "license": "FSL-1.1-Apache-2.0",
   "type": "module",

package/packages/gui/src/components/onboarding/setup-wizard.jsx

@@ -131,7 +131,13 @@ function ProjectFolderStep({ selectedDir, onSelectDir }) {
   const remoteHomedir = useGrooveStore((s) => s.remoteHomedir);
   const [browsing, setBrowsing] = useState(false);
 
+  const isRemote = new URLSearchParams(window.location.search).has('instance');
+
   async function handleBrowse() {
+    if (isRemote) {
+      setBrowsing(true);
+      return;
+    }
     const dir = await selectFolder({
       title: 'Choose your project folder',
       defaultPath: selectedDir || undefined,

package/packages/gui/src/components/settings/ProviderSetupWizard.jsx

@@ -145,9 +145,9 @@ function InstallStep({ providerId, meta }) {
 
       {hasError && (
         <div className="space-y-3">
-          {typeof hasError === 'string' && hasError.length > 40 && (
-            <div className="p-3 bg-surface-0 border border-border-subtle rounded-md max-h-24 overflow-y-auto">
-              <p className="text-2xs font-mono text-danger/80 whitespace-pre-wrap break-all">{hasError}</p>
+          {typeof hasError === 'string' && (
+            <div className="p-3 bg-danger/5 border border-danger/20 rounded-md max-h-32 overflow-y-auto">
+              <p className="text-2xs font-mono text-danger whitespace-pre-wrap break-all">{hasError}</p>
             </div>
           )}
           <p className="text-xs text-text-2 font-sans">Check that npm is in your PATH and try again.</p>
@@ -172,6 +172,8 @@ function AuthenticateStep({ providerId, meta, onSaveKey }) {
   const [showKey, setShowKey] = useState(false);
   const [saving, setSaving] = useState(false);
   const [loginStarted, setLoginStarted] = useState(false);
+  const [verifying, setVerifying] = useState(false);
+  const [verifyError, setVerifyError] = useState('');
   const [authMode, setAuthMode] = useState(meta.authType === 'subscription' ? 'subscription' : 'apikey');
 
   async function handleSaveKey() {
@@ -261,9 +263,33 @@ function AuthenticateStep({ providerId, meta, onSaveKey }) {
                 <ExternalLink size={12} className="text-accent" />
                 <span className="text-xs text-accent font-sans">Sign-in opened in your browser</span>
               </div>
-              <Button variant="primary" size="sm" onClick={onSaveKey} className="gap-1.5">
-                <Check size={11} /> I've signed in
+              <Button
+                variant="primary"
+                size="sm"
+                disabled={verifying}
+                onClick={async () => {
+                  setVerifying(true);
+                  setVerifyError('');
+                  try {
+                    const res = await api.post(`/providers/${providerId}/verify`);
+                    if (res.authenticated) {
+                      onSaveKey();
+                    } else {
+                      setVerifyError('Authentication not detected yet. Please complete sign-in in your browser and try again.');
+                    }
+                  } catch {
+                    setVerifyError('Authentication not detected yet. Please complete sign-in in your browser and try again.');
+                  } finally {
+                    setVerifying(false);
+                  }
+                }}
+                className="gap-1.5"
+              >
+                {verifying ? <Loader2 size={11} className="animate-spin" /> : <Check size={11} />} I've signed in
               </Button>
+              {verifyError && (
+                <p className="text-2xs text-danger font-sans">{verifyError}</p>
+              )}
             </div>
           )}
           <p className="text-2xs text-text-4 font-sans">
@@ -287,9 +313,33 @@ function AuthenticateStep({ providerId, meta, onSaveKey }) {
                 <ExternalLink size={12} className="text-accent" />
                 <span className="text-xs text-accent font-sans">Sign-in opened in your browser</span>
               </div>
-              <Button variant="primary" size="sm" onClick={onSaveKey} className="gap-1.5">
-                <Check size={11} /> I've signed in
+              <Button
+                variant="primary"
+                size="sm"
+                disabled={verifying}
+                onClick={async () => {
+                  setVerifying(true);
+                  setVerifyError('');
+                  try {
+                    const res = await api.post(`/providers/codex/verify`);
+                    if (res.authenticated) {
+                      onSaveKey();
+                    } else {
+                      setVerifyError('Authentication not detected yet. Please complete sign-in in your browser and try again.');
+                    }
+                  } catch {
+                    setVerifyError('Authentication not detected yet. Please complete sign-in in your browser and try again.');
+                  } finally {
+                    setVerifying(false);
+                  }
+                }}
+                className="gap-1.5"
+              >
+                {verifying ? <Loader2 size={11} className="animate-spin" /> : <Check size={11} />} I've signed in
               </Button>
+              {verifyError && (
+                <p className="text-2xs text-danger font-sans">{verifyError}</p>
+              )}
             </div>
           )}
         </div>

package/packages/gui/src/views/settings.jsx

@@ -454,10 +454,43 @@ function ProviderCard({ provider, onKeyChange }) {
                   <Button
                     variant="primary"
                     size="sm"
-                    onClick={() => { setLoginPending(false); if (onKeyChange) onKeyChange(); }}
+                    disabled={checking}
+                    onClick={async () => {
+                      if (provider.id === 'codex') {
+                        setChecking(true);
+                        try {
+                          const res = await api.post(`/providers/codex/verify`);
+                          if (res.authenticated) {
+                            setLoginPending(false);
+                            if (onKeyChange) onKeyChange();
+                          } else {
+                            addToast('error', 'Authentication not detected yet. Please complete sign-in in your browser and try again.');
+                          }
+                        } catch {
+                          addToast('error', 'Authentication not detected yet. Please complete sign-in in your browser and try again.');
+                        } finally {
+                          setChecking(false);
+                        }
+                      } else {
+                        setChecking(true);
+                        try {
+                          const res = await api.post(`/providers/claude-code/verify`);
+                          if (res.authenticated) {
+                            setLoginPending(false);
+                            if (onKeyChange) onKeyChange();
+                          } else {
+                            addToast('error', 'Authentication not detected yet. Please complete sign-in in your browser and try again.');
+                          }
+                        } catch {
+                          addToast('error', 'Authentication not detected yet. Please complete sign-in in your browser and try again.');
+                        } finally {
+                          setChecking(false);
+                        }
+                      }
+                    }}
                     className="w-full h-8 text-xs gap-1.5"
                   >
-                    <Check size={12} /> I've signed in
+                    {checking ? <Loader2 size={12} className="animate-spin" /> : <Check size={12} />} I've signed in
                   </Button>
                   <button
                     onClick={() => setLoginPending(false)}