tylerg/auth-yes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): ensure CLI row is always visible on event cards and expands full command into textarea

Browse Source
This commit is contained in:
Tyler Gillispie 2026-08-26 19:40:30 -07:00
parent 8777ae33c8
commit 86896fa8c3
1 changed files with 35 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
ui/components/sessions/EventCockpitDeck.tsx
View File

@ -52,7 +52,7 @@ export const EventCockpitDeck = ({ eventPasses }: { eventPasses: any[] }) => {
{/* Quick Copy Snippets */}
<div style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;">
<div style="display: flex; align-items: center; gap: 0.5rem;">
<span style="font-size: 0.8rem; font-weight: 600; width: 60px; color: var(--text-muted);">
<span style="font-size: 0.8rem; font-weight: 600; width: 45px; color: var(--text-muted);">
PIN:
</span>
<code
@ -79,7 +79,7 @@ export const EventCockpitDeck = ({ eventPasses }: { eventPasses: any[] }) => {
</button>
</div>
<div style="display: flex; align-items: center; gap: 0.5rem;">
<span style="font-size: 0.8rem; font-weight: 600; width: 60px; color: var(--text-muted);">
<span style="font-size: 0.8rem; font-weight: 600; width: 45px; color: var(--text-muted);">
Link:
</span>
<code style="flex: 1; padding: 0.35rem 0.5rem; background: var(--surface-muted); border-radius: var(--radius-sm); font-family: monospace; font-size: 0.75rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
@ -95,25 +95,41 @@ export const EventCockpitDeck = ({ eventPasses }: { eventPasses: any[] }) => {
</button>
</div>
<details style="font-size: 0.8rem;">
<summary style="cursor: pointer; color: var(--primary); font-weight: 600;">
Show CLI 1-liner handoff
<div style="display: flex; align-items: center; gap: 0.5rem;">
<span style="font-size: 0.8rem; font-weight: 600; width: 45px; color: var(--text-muted);">
CLI:
</span>
<code style="flex: 1; padding: 0.35rem 0.5rem; background: var(--surface-muted); border-radius: var(--radius-sm); font-family: monospace; font-size: 0.75rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
curl -sSL {Deno.env.get("RP_ID")
? `https://${Deno.env.get("RP_ID")}`
: ""}/join/{event.slug}?format=env | source /dev/stdin
</code>
<button
type="button"
class="btn-outline"
style="padding: 0.25rem 0.5rem; font-size: 0.75rem; min-height: 28px;"
onclick={`copyText("curl -sSL " + window.location.origin + "/join/${event.slug}?format=env | source /dev/stdin")`}
>
Copy
</button>
</div>
<details style="font-size: 0.75rem; margin-top: 0.1rem;">
<summary style="cursor: pointer; color: var(--primary); font-weight: 600; user-select: none;">
▸ Expand full CLI command
</summary>
<div style="margin-top: 0.5rem; display: flex; align-items: center; gap: 0.5rem;">
<code style="flex: 1; padding: 0.35rem 0.5rem; background: var(--surface-muted); border-radius: var(--radius-sm); font-family: monospace; font-size: 0.75rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
curl -sSL {Deno.env.get("RP_ID")
<textarea
readonly
rows={2}
style="width: 100%; margin-top: 0.4rem; padding: 0.4rem 0.5rem; font-family: monospace; font-size: 0.75rem; background: var(--surface-muted); color: var(--text-primary); border: 1px solid var(--border-subtle); border-radius: var(--radius-sm); resize: vertical; box-sizing: border-box;"
onclick="this.select()"
>
{`curl -sSL ${
Deno.env.get("RP_ID")
? `https://${Deno.env.get("RP_ID")}`
: ""}/join/{event.slug}?format=env | source /dev/stdin
</code>
<button
type="button"
class="btn-outline"
style="padding: 0.25rem 0.5rem; font-size: 0.75rem; min-height: 28px;"
onclick={`copyText("curl -sSL " + window.location.origin + "/join/${event.slug}?format=env | source /dev/stdin")`}
>
Copy
</button>
</div>
: ""
}/join/${event.slug}?format=env | source /dev/stdin`}
</textarea>
</details>
</div>