core-lead/molecule-core
1
0
Fork 0
forked from molecule-ai/molecule-core
Code Pull Requests Activity

Merge pull request #2577 from Molecule-AI/fix/canvas-tier-legend-t3-t4-contract

Browse Source 
fix(canvas): align tier text contracts with 4-tier reality (T1/T2/T3/T4)
This commit is contained in:
Hongming Wang 2026-05-03 12:58:52 +00:00 committed by GitHub
commit d7f88674d8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 20 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
canvas/src/components/Legend.tsx
View File

@ -1,11 +1,23 @@
"use client";
import { useEffect, useState } from "react";
import { STATUS_CONFIG } from "@/lib/design-tokens";
import { STATUS_CONFIG, TIER_CONFIG } from "@/lib/design-tokens";
import { useCanvasStore } from "@/store/canvas";
const LEGEND_STATUSES = ["online", "provisioning", "degraded", "failed", "paused", "offline"] as const;
// Tier descriptions kept in sync with CreateWorkspaceDialog.tsx (the
// source of truth for what each tier means semantically). Colors come
// from TIER_CONFIG so the legend swatch matches the badge actually
// rendered on every WorkspaceNode — drift here misled users into
// thinking the legend documented a different tier than the one shown.
const LEGEND_TIERS: ReadonlyArray<{ tier: number; label: string }> = [
{ tier: 1, label: "Sandboxed" },
{ tier: 2, label: "Standard" },
{ tier: 3, label: "Privileged" },
{ tier: 4, label: "Full Access" },
];
// Persist the user's choice across sessions. Default is "open" so
// first-time users still see the symbol key; once dismissed we
// respect that until they explicitly reopen via the floating pill.
@ -102,9 +114,9 @@ export function Legend() {
<div className="mb-2">
<div className="text-[11px] text-ink-soft font-medium mb-1">Tier</div>
<div className="flex flex-wrap gap-x-3 gap-y-1">
<TierItem tier={1} label="Sandboxed" color="text-sky-300 bg-sky-950/40 border-sky-700/30" />
<TierItem tier={2} label="Standard" color="text-violet-300 bg-violet-950/40 border-violet-700/30" />
<TierItem tier={3} label="Full Access" color="text-warm bg-amber-950/40 border-amber-700/30" />
{LEGEND_TIERS.map(({ tier, label }) => (
<TierItem key={tier} tier={tier} label={label} color={TIER_CONFIG[tier].border} />
))}
</div>
</div>

3
canvas/src/components/tabs/ConfigTab.tsx
View File

@ -655,7 +655,8 @@ export function ConfigTab({ workspaceId }: Props) {
>
<option value={1}>T1 — Sandboxed</option>
<option value={2}>T2 — Standard</option>
<option value={3}>T3 — Full Access</option>
<option value={3}>T3 — Privileged</option>
<option value={4}>T4 — Full Access</option>
</select>
</div>
</div>

4
canvas/src/lib/tenant.ts
View File

@ -59,8 +59,8 @@ export function getTenantSlug(): string {
* isSaaSTenant reports whether the canvas is running as the UI for a
* SaaS tenant (served at <slug>.moleculesai.app). Use for client-side
* UX branches that should behave differently on SaaS vs self-hosted —
* e.g. the workspace tier picker hides T1/T2 sandbox tiers because every
* SaaS workspace gets its own EC2 VM (inherently T3 Full Access).
* e.g. the workspace tier picker hides T1/T2/T3 sandbox tiers because
* every SaaS workspace gets its own EC2 VM (inherently T4 Full Access).
*
* SSR-safe: returns false on the server to avoid hydration drift; call
* sites should tolerate a flip from false→true on first client render.