fix: move setup guide to post-registration step where credentials exist

- Remove setup guide from pre-registration bot-setup step (no credentials yet)
- Add collapsible guide preview to ready step with real bot_id/secret injected
- "COPY GUIDE + CREDENTIALS" copies the full guide with credentials embedded

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-03-13 17:15:11 +00:00
co-authored by Claude Opus 4.6
parent 2e7a039b8b
commit d17f6970b9
+29 -34
View File
@@ -965,7 +965,7 @@ function handleSignOut() {
SET UP {{ botName.toUpperCase() }} SET UP {{ botName.toUpperCase() }}
</h2> </h2>
<p class="font-mono text-text-muted text-xs"> <p class="font-mono text-text-muted text-xs">
Pick a mode, download the guide, tell your AI. Pick how your bot connects.
</p> </p>
</div> </div>
@@ -1009,39 +1009,6 @@ function handleSignOut() {
</button> </button>
</div> </div>
<!-- Setup guide (collapsible) -->
<div class="mb-3">
<button
class="w-full py-2.5 border-2 font-display font-bold text-sm tracking-wider transition-all"
:class="connectionMode === 'webhook'
? 'border-neon-cyan/50 text-neon-cyan hover:bg-neon-cyan/10'
: 'border-neon-purple/50 text-neon-purple hover:bg-neon-purple/10'"
@click="toggleSetupContent"
>
{{ showSetupContent ? 'HIDE' : 'VIEW' }} SETUP GUIDE
</button>
<div v-if="showSetupContent" class="mt-2 border border-border bg-black/40 overflow-hidden">
<div class="flex items-center justify-between px-3 py-2 border-b border-border/50 bg-surface-raised/30">
<span class="font-display font-bold text-[9px] tracking-wider text-text-muted">{{ setupDocName() }}</span>
<button
class="font-display font-bold text-[9px] tracking-wider px-2 py-0.5 border transition-all"
:class="setupContentCopied
? 'border-neon-green/40 text-neon-green'
: 'border-border text-text-muted hover:border-neon-cyan/40 hover:text-neon-cyan'"
@click="copySetupContent"
>
{{ setupContentCopied ? 'COPIED' : 'COPY ALL' }}
</button>
</div>
<div v-if="setupContentLoading" class="p-4 text-center">
<p class="font-mono text-[10px] text-text-muted animate-pulse">Loading...</p>
</div>
<pre v-else class="p-3 font-mono text-[10px] text-text-secondary leading-relaxed
overflow-x-auto max-h-80 overflow-y-auto whitespace-pre-wrap break-words select-all">{{ setupContent }}</pre>
</div>
</div>
<!-- Safety callout --> <!-- Safety callout -->
<div class="p-2.5 border border-neon-cyan/20 bg-neon-cyan/5 mb-4"> <div class="p-2.5 border border-neon-cyan/20 bg-neon-cyan/5 mb-4">
<p class="font-display font-bold text-[10px] tracking-wider text-neon-cyan mb-1"> <p class="font-display font-bold text-[10px] tracking-wider text-neon-cyan mb-1">
@@ -1353,6 +1320,34 @@ function handleSignOut() {
Paste this into your AI (Claude, ChatGPT, etc.) it includes the full setup guide with your credentials. Paste this into your AI (Claude, ChatGPT, etc.) it includes the full setup guide with your credentials.
Save these credentials the secret won't be shown again. Save these credentials the secret won't be shown again.
</p> </p>
<!-- Collapsible guide preview -->
<button
class="w-full mt-2 py-1.5 border border-border text-[9px] font-display font-bold tracking-wider
text-text-muted hover:border-neon-cyan/40 hover:text-neon-cyan transition-all"
@click="toggleSetupContent"
>
{{ showSetupContent ? 'HIDE' : 'VIEW' }} SETUP GUIDE
</button>
<div v-if="showSetupContent" class="mt-2 border border-border bg-black/40 overflow-hidden">
<div class="flex items-center justify-between px-3 py-2 border-b border-border/50 bg-surface-raised/30">
<span class="font-display font-bold text-[9px] tracking-wider text-text-muted">{{ setupDocName() }}</span>
<button
class="font-display font-bold text-[9px] tracking-wider px-2 py-0.5 border transition-all"
:class="setupContentCopied
? 'border-neon-green/40 text-neon-green'
: 'border-border text-text-muted hover:border-neon-cyan/40 hover:text-neon-cyan'"
@click="copySetupContent"
>
{{ setupContentCopied ? 'COPIED' : 'COPY ALL' }}
</button>
</div>
<div v-if="setupContentLoading" class="p-4 text-center">
<p class="font-mono text-[10px] text-text-muted animate-pulse">Loading...</p>
</div>
<pre v-else class="p-3 font-mono text-[10px] text-text-secondary leading-relaxed
overflow-x-auto max-h-80 overflow-y-auto whitespace-pre-wrap break-words select-all">{{ setupContent }}</pre>
</div>
</div> </div>
<div class="mb-4 text-center"> <div class="mb-4 text-center">