-
+
{newProjectName.length > 0 ? newProjectName : "New project"}
diff --git a/apps/web/src/components/GitActionsControl.logic.test.ts b/apps/web/src/components/GitActionsControl.logic.test.ts
index 12aee26c757ed118e811f6948b65160a43c4c6c6..adecc5d7e1e0b57a3bb0643def97ba8588406055 100644
--- a/apps/web/src/components/GitActionsControl.logic.test.ts
+++ b/apps/web/src/components/GitActionsControl.logic.test.ts
@@ -823,7 +823,7 @@ describe("when: ref has no upstream configured", () => {
});
});
- it("resolveQuickAction publishes when no origin remote exists", () => {
+ it("resolveQuickAction rests without offering repository creation when no remote exists", () => {
const quick = resolveQuickAction(
status({
hasUpstream: false,
@@ -835,9 +835,10 @@ describe("when: ref has no upstream configured", () => {
false,
);
assert.deepEqual(quick, {
- kind: "open_publish",
- label: "Publish repository",
- disabled: false,
+ kind: "show_hint",
+ label: "Commit",
+ disabled: true,
+ hint: "No changes to commit.",
});
});
diff --git a/apps/web/src/components/GitActionsControl.logic.ts b/apps/web/src/components/GitActionsControl.logic.ts
index af6206625c4112aa909eb3a1343638deef9e41d3..444900573be6581042444e174337289ad843360d 100644
--- a/apps/web/src/components/GitActionsControl.logic.ts
+++ b/apps/web/src/components/GitActionsControl.logic.ts
@@ -23,7 +23,7 @@ export interface GitActionMenuItem {
export interface GitQuickAction {
label: string;
disabled: boolean;
- kind: "run_action" | "run_pull" | "open_publish" | "show_hint";
+ kind: "run_action" | "run_pull" | "show_hint";
action?: GitStackedAction;
hint?: string;
}
@@ -281,9 +281,10 @@ export function resolveQuickAction(
if (!gitStatus.hasUpstream) {
if (!hasPrimaryRemote) {
return {
- label: "Publish repository",
- disabled: false,
- kind: "open_publish",
+ label: "Commit",
+ disabled: true,
+ kind: "show_hint",
+ hint: "No changes to commit.",
};
}
if (!isAhead) {
diff --git a/apps/web/src/components/GitActionsControl.tsx b/apps/web/src/components/GitActionsControl.tsx
index 8164537ee3a248cf204b53a038286741d4685e8e..cd3e701a76b58f4bd6203fb00ac78607013ec526 100644
--- a/apps/web/src/components/GitActionsControl.tsx
+++ b/apps/web/src/components/GitActionsControl.tsx
@@ -3,7 +3,6 @@ import { useAtomValue } from "@effect/atom-react";
import {
AuthOrchestrationOperateScope,
AuthSourceControlWriteScope,
- SourceControlProviderKind,
type ScopedThreadRef,
} from "@t3tools/contracts";
import {
@@ -13,32 +12,27 @@ import {
import type {
GitRunStackedActionResult,
GitStackedAction,
- SourceControlCloneProtocol,
- SourceControlProviderDiscoveryItem,
- SourceControlPublishRepositoryResult,
- SourceControlRepositoryVisibility,
VcsStatusResult,
} from "@t3tools/contracts";
-import { useNavigate } from "@tanstack/react-router";
-import * as Option from "effect/Option";
-import { type MouseEvent, useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { flushSync } from "react-dom";
+import {
+ type MouseEvent,
+ useCallback,
+ useEffect,
+ useEffectEvent,
+ useMemo,
+ useRef,
+ useState,
+} from "react";
import {
CheckIcon,
ChevronDownIcon,
CloudDownloadIcon,
CloudUploadIcon,
FileDiffIcon,
- GitBranchPlusIcon,
GitCommitIcon,
InfoIcon,
- LockIcon,
- GlobeIcon,
} from "lucide-react";
-import { Radio as RadioPrimitive } from "@base-ui/react/radio";
-import { RadioGroup } from "~/components/ui/radio-group";
import { Spinner } from "~/components/ui/spinner";
-import { Toggle, ToggleGroup } from "~/components/ui/toggle-group";
import { cn } from "~/lib/utils";
import { useOpenPrLink } from "~/lib/openPullRequestLink";
import {
@@ -59,7 +53,6 @@ import {
resolveQuickAction,
resolveThreadBranchUpdate,
} from "./GitActionsControl.logic";
-import { WizardPopup, WizardHeader, WizardSteps, WizardPanel, WizardFooter } from "./ui/wizard";
import { StartTruncatedPath } from "./StartTruncatedPath";
import { Button } from "~/components/ui/button";
import { Checkbox } from "~/components/ui/checkbox";
@@ -73,7 +66,6 @@ import {
DialogTitle,
} from "~/components/ui/dialog";
import { Group, GroupSeparator } from "~/components/ui/group";
-import { Input } from "~/components/ui/input";
import {
Menu,
MenuItem,
@@ -93,15 +85,12 @@ import { useOpenInPreferredEditor } from "~/editorPreferences";
import {
useGitStackedAction,
useSourceControlActionRunning,
- useSourceControlPublishRepositoryAction,
- useVcsInitAction,
useVcsPullAction,
} from "~/lib/sourceControlActions";
import { useThreadProjection, useThreadShell } from "~/state/entities";
import { readEnvironmentScope, useEnvironmentScope } from "~/state/session";
import { useEnvironmentQuery } from "~/state/query";
import { serverEnvironment } from "~/state/server";
-import { sourceControlEnvironment } from "~/state/sourceControl";
import { threadEnvironment } from "~/state/threads";
import { useAtomCommand } from "~/state/use-atom-command";
import { vcsActionManager, vcsEnvironment } from "~/state/vcs";
@@ -115,10 +104,8 @@ import {
THREAD_DETAILS_PANEL_SPLIT_GROUP_CLASS,
THREAD_DETAILS_PANEL_SPLIT_SEPARATOR_CLASS,
} from "./chat/threadDetailsPanelStyles";
-import { getSourceControlPresentation, sourceControlIcon } from "~/sourceControlPresentation";
-import { sourceControlClients } from "@t3tools/client-runtime/source-control-clients";
+import { getSourceControlPresentation } from "~/sourceControlPresentation";
import { formatDiffCount } from "@t3tools/client-runtime/diff-count";
-import { useOpenLink } from "~/browser/useOpenLink";
interface GitActionsControlProps {
presentation?: "toolbar" | "menu";
@@ -182,49 +169,6 @@ function requestVcsStatusRefresh(
const RUNNING_SOURCE_CONTROL_ACTIONS = ["runStackedAction", "pull", "publishRepository"] as const;
/** Every built-in host, in the order the built-in definitions list them. */
-const PUBLISH_PROVIDER_OPTIONS = sourceControlClients.definitions.map((definition) => ({
- value: definition.kind,
- label: definition.pickerLabel,
- description: definition.publishDescription,
- pathPlaceholder: definition.repositoryPathHint,
- definition,
- Icon: sourceControlIcon(definition),
-}));
-
-function publishProviderOption(provider: SourceControlProviderKind) {
- return (
- PUBLISH_PROVIDER_OPTIONS.find((option) => option.value === provider) ??
- PUBLISH_PROVIDER_OPTIONS[0]!
- );
-}
-
-function getPublishProviderReadiness(input: {
- provider: SourceControlProviderKind;
- sourceControlProviders: ReadonlyArray;
-}): { readonly ready: boolean; readonly hint: string | null } {
- const discovered = input.sourceControlProviders.find(
- (provider) => provider.kind === input.provider,
- );
- if (!discovered) {
- return {
- ready: false,
- hint: "Provider status unavailable. Open Settings -> Source Control and rescan.",
- };
- }
- if (discovered.status !== "available") {
- return { ready: false, hint: discovered.installHint };
- }
- if (discovered.auth.status === "unauthenticated") {
- return {
- ready: false,
- hint:
- Option.getOrNull(discovered.auth.detail) ??
- `${discovered.label} is not authenticated. Open Settings -> Source Control for setup guidance.`,
- };
- }
- return { ready: true, hint: null };
-}
-
function getMenuActionDisabledReason({
item,
gitStatus,
@@ -312,7 +256,6 @@ function GitQuickActionIcon({
className?: string;
SourceControlIcon: ReturnType["Icon"];
}) {
- if (quickAction.kind === "open_publish") return ;
if (quickAction.kind === "run_pull") return ;
if (quickAction.kind === "run_action") {
if (quickAction.action === "commit") return ;
@@ -458,539 +401,6 @@ function GitActionSuccessButtonContent({ success }: { success: InlineGitActionSu
);
}
-interface PublishRepositoryDialogProps {
- readonly open: boolean;
- readonly onOpenChange: (open: boolean) => void;
- readonly environmentId: ScopedThreadRef["environmentId"] | null;
- /** Thread the dialog was opened from, so the new repository can open beside it. */
- readonly threadRef: ScopedThreadRef | null;
- readonly gitCwd: string;
-}
-
-function PublishRepositoryDialog(props: PublishRepositoryDialogProps) {
- const openLink = useOpenLink(props.threadRef);
- const navigate = useNavigate();
- const sourceControlDiscovery = useEnvironmentQuery(
- props.environmentId === null
- ? null
- : sourceControlEnvironment.discovery({
- environmentId: props.environmentId,
- input: {},
- }),
- );
- const [selectedPublishProvider, setSelectedPublishProvider] =
- useState(null);
- const [publishRepositoryOverride, setPublishRepositoryOverride] = useState(null);
- const [publishVisibility, setPublishVisibility] =
- useState("private");
- const [publishRemoteName, setPublishRemoteName] = useState("origin");
- const [publishProtocol, setPublishProtocol] = useState("ssh");
- const [publishWizardStep, setPublishWizardStep] = useState(0);
- const [publishAdvancedOpen, setPublishAdvancedOpen] = useState(false);
- const [publishError, setPublishError] = useState(null);
- const [publishResult, setPublishResult] = useState(
- null,
- );
- const sourceControlScope = useMemo(
- () => ({
- environmentId: props.environmentId,
- cwd: props.gitCwd,
- }),
- [props.environmentId, props.gitCwd],
- );
- const publishRepositoryAction = useSourceControlPublishRepositoryAction(sourceControlScope);
- const publishAccountByProvider = useMemo(() => {
- const accounts = new Map();
- for (const provider of sourceControlDiscovery.data?.sourceControlProviders ?? []) {
- accounts.set(provider.kind, Option.getOrNull(provider.auth.account));
- }
- return accounts;
- }, [sourceControlDiscovery.data]);
- const publishProviderReadiness = useMemo(() => {
- const sourceControlProviders = sourceControlDiscovery.data?.sourceControlProviders ?? [];
- const readiness = new Map(
- PUBLISH_PROVIDER_OPTIONS.map((option) => [
- option.value,
- getPublishProviderReadiness({ provider: option.value, sourceControlProviders }),
- ]),
- );
- return (provider: SourceControlProviderKind) =>
- readiness.get(provider) ?? { ready: false, hint: null };
- }, [sourceControlDiscovery.data]);
- const hasReadyPublishProvider = useMemo(
- () => PUBLISH_PROVIDER_OPTIONS.some((option) => publishProviderReadiness(option.value).ready),
- [publishProviderReadiness],
- );
- const sortedPublishProviderOptions = useMemo(
- () =>
- PUBLISH_PROVIDER_OPTIONS.toSorted((left, right) => {
- const leftReady = publishProviderReadiness(left.value).ready;
- const rightReady = publishProviderReadiness(right.value).ready;
- if (leftReady !== rightReady) {
- return leftReady ? -1 : 1;
- }
- return left.label.localeCompare(right.label);
- }),
- [publishProviderReadiness],
- );
- const firstReadyPublishProvider = sortedPublishProviderOptions.find(
- (option) => publishProviderReadiness(option.value).ready,
- )?.value;
- const publishProvider =
- selectedPublishProvider !== null && publishProviderReadiness(selectedPublishProvider).ready
- ? selectedPublishProvider
- : (firstReadyPublishProvider ??
- selectedPublishProvider ??
- sourceControlClients.get(undefined).kind);
- const selectedPublishProviderReadiness = publishProviderReadiness(publishProvider);
- const publishAccount = publishAccountByProvider.get(publishProvider) ?? null;
- const publishRepositoryPrefill = publishAccount ? `${publishAccount}/` : "";
- const publishRepository = publishRepositoryOverride ?? publishRepositoryPrefill;
- const currentPublishProvider = publishProviderOption(publishProvider);
- const publishHost = currentPublishProvider.definition.publishHost(
- Option.getOrNull(
- sourceControlDiscovery.data?.sourceControlProviders.find(
- (provider) => provider.kind === publishProvider,
- )?.auth.host ?? Option.none(),
- ),
- );
- const publishPathPlaceholder = currentPublishProvider.pathPlaceholder;
- const publishProviderLabel = currentPublishProvider.label;
- const publishWizardSteps = ["Provider", "Repository", "Summary"] as const;
- const publishWizardStepSummaries = [
- publishProviderLabel,
- publishResult?.repository.nameWithOwner ?? null,
- null,
- ] as const;
-
- const canSubmitPublishRepository = useMemo(() => {
- if (!publishRepositoryAction.isAllowed || !selectedPublishProviderReadiness.ready) return false;
- if (publishRepositoryAction.isPending) return false;
- const repositoryParts = publishRepository.trim().split("/");
- const owner = repositoryParts[0]?.trim() ?? "";
- const rest = repositoryParts.slice(1);
- const name = rest.join("/").trim();
- return owner.length > 0 && name.length > 0;
- }, [
- publishRepository,
- publishRepositoryAction.isAllowed,
- publishRepositoryAction.isPending,
- selectedPublishProviderReadiness,
- ]);
-
- const submitPublishRepository = useCallback(() => {
- if (!canSubmitPublishRepository) {
- return;
- }
-
- setPublishError(null);
-
- void (async () => {
- const result = await publishRepositoryAction.run({
- provider: publishProvider,
- repository: publishRepository.trim(),
- visibility: publishVisibility,
- remoteName: publishRemoteName.trim() || "origin",
- protocol: publishProtocol,
- });
-
- if (result._tag === "Failure") {
- if (!isAtomCommandInterrupted(result)) {
- const error = squashAtomCommandFailure(result);
- setPublishError(error instanceof Error ? error.message : "An error occurred.");
- }
- return;
- }
-
- flushSync(() => {
- setPublishResult(result.value);
- setPublishWizardStep(2);
- });
- })();
- }, [
- canSubmitPublishRepository,
- props.environmentId,
- props.gitCwd,
- publishProtocol,
- publishProvider,
- publishRemoteName,
- publishRepository,
- publishRepositoryAction,
- publishVisibility,
- ]);
-
- const resetState = useCallback(() => {
- setPublishRemoteName("origin");
- setPublishRepositoryOverride(null);
- setPublishWizardStep(0);
- setPublishAdvancedOpen(false);
- setPublishError(null);
- setPublishResult(null);
- }, []);
-
- const handleOpenChange = useCallback(
- (open: boolean) => {
- props.onOpenChange(open);
- if (!open) {
- resetState();
- }
- },
- [props, resetState],
- );
-
- const openSourceControlSettings = useCallback(() => {
- handleOpenChange(false);
- void navigate({ to: "/settings/source-control" });
- }, [handleOpenChange, navigate]);
-
- return (
-
- );
-}
-
export default function GitActionsControl({
presentation = "toolbar",
gitCwd,
@@ -1044,7 +454,6 @@ export default function GitActionsControl({
const [dialogCommitMessage, setDialogCommitMessage] = useState("");
const [excludedFiles, setExcludedFiles] = useState>(new Set());
const [isEditingFiles, setIsEditingFiles] = useState(false);
- const [isPublishDialogOpen, setIsPublishDialogOpen] = useState(false);
const [inlineSuccess, setInlineSuccess] = useState(null);
const [pendingDefaultBranchAction, setPendingDefaultBranchAction] =
useState(null);
@@ -1153,7 +562,6 @@ export default function GitActionsControl({
const allSelected = excludedFiles.size === 0;
const noneSelected = selectedFiles.length === 0;
- const initAction = useVcsInitAction(sourceControlScope);
const runImmediateGitAction = useGitStackedAction(sourceControlScope);
const pullAction = useVcsPullAction(sourceControlScope);
const isGitActionRunning = useSourceControlActionRunning(
@@ -1470,10 +878,6 @@ export default function GitActionsControl({
};
const runQuickAction = () => {
- if (quickAction.kind === "open_publish") {
- setIsPublishDialogOpen(true);
- return;
- }
if (quickAction.kind === "run_pull") {
void (async () => {
setInlineSuccess(null);
@@ -1595,26 +999,6 @@ export default function GitActionsControl({
[gitCwd, openInPreferredEditor, threadToastData],
);
- const canPublishRepository =
- canWriteSourceControl && isRepo && gitStatusForActions !== null && !hasPrimaryRemote;
-
- const initializeGit = () => {
- void (async () => {
- const result = await initAction.run();
- if (result._tag === "Success" || isAtomCommandInterrupted(result)) {
- return;
- }
- const error = squashAtomCommandFailure(result);
- toastManager.add(
- stackedThreadToast({
- type: "error",
- title: "Git initialization failed",
- description: error instanceof Error ? error.message : "An error occurred.",
- ...(threadToastData !== undefined ? { data: threadToastData } : {}),
- }),
- );
- })();
- };
const gitItems = (
<>
{gitActionMenuItems.map((item) => {
@@ -1673,18 +1057,6 @@ export default function GitActionsControl({
);
})}
- {canPublishRepository ? (
-
- ) : null}
{gitStatusForActions?.refName === null && (
Detached HEAD: create and check out a branch to enable push and pull request actions.
@@ -1701,70 +1073,40 @@ export default function GitActionsControl({
);
- if (!gitCwd) return null;
+ if (!gitCwd || !isRepo) return null;
return (
<>
{presentation === "menu" ? (
- !isRepo ? (
+ <>
- ) : (
- <>
-
- {quickActionDisabledReason && (
-
- {quickActionDisabledReason}
-
- )}
- {
- if (open) requestVcsStatusRefresh(refreshVcsStatus, activeEnvironmentId, gitCwd);
- }}
- >
-
-
- Git actions
-
- {gitItems}
-
-
- )
- ) : !isRepo ? (
-
-
-
- {initAction.isPending ? "Initializing..." : "Initialize Git"}
-
-
+ {quickActionDisabledReason && (
+ {quickActionDisabledReason}
+ )}
+ {
+ if (open) requestVcsStatusRefresh(refreshVcsStatus, activeEnvironmentId, gitCwd);
+ }}
+ >
+
+
+ Git actions
+
+ {gitItems}
+
+
) : compact && !gitActionProgress && !visibleInlineSuccess ? null : (
-
-
);
});
-// Measures the brand at its titlebar inset, plus the header's right padding and the
-// sidebar border, so the sidebar minimum follows font size, zoom and macOS window controls.
-export function SidebarBrandWidthProbe({
- onWidthChange,
-}: {
- onWidthChange: (width: number) => void;
-}) {
- const observeWidth = useCallback(
- (probe: HTMLDivElement) => {
- return observeResize(probe, ([entry]) => {
- if (entry) onWidthChange(entry.borderBoxSize[0]?.inlineSize ?? probe.offsetWidth);
- });
- },
- [onWidthChange],
- );
-
- return (
-
- );
-}
-
-function SidebarBrand({ onBackdrop }: { onBackdrop: boolean }) {
- return (
-
-
-
- );
-}
-
-function SidebarBrandMark({ onBackdrop }: { onBackdrop: boolean }) {
- return (
- // Center the visible capitals, without the font's ascender/descender space.
- // Padding keeps ascenders and round-letter overshoot inside the truncation clip.
-
-
-
- Code
-
-
- );
-}
-
function SidebarUtilityItem({
icon,
label,
@@ -188,11 +109,6 @@ export const SidebarUtilityMenu = memo(function SidebarUtilityMenu() {
search: readPullRequestListPreferences(),
});
}, [closeMobileSidebar, navigate]);
- const handleSettingsClick = useCallback(() => {
- closeMobileSidebar();
- void navigate({ to: "/settings" });
- }, [closeMobileSidebar, navigate]);
-
const handleUsageClick = useCallback(() => {
if (isMobile) {
setOpenMobile(false);
@@ -216,11 +132,6 @@ export const SidebarUtilityMenu = memo(function SidebarUtilityMenu() {
) : (
<>
-
}
- label="Settings"
- onClick={handleSettingsClick}
- />
{pullRequestsSupported ? (
}
@@ -235,7 +146,6 @@ export const SidebarUtilityMenu = memo(function SidebarUtilityMenu() {
/>
)}
-
);
});
@@ -244,8 +154,6 @@ export const SidebarChromeFooter = memo(function SidebarChromeFooter() {
return (
-
-
);
diff --git a/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx b/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx
deleted file mode 100644
index d584e04656f2849418bc5eb8bc63d4ab3dc4f212..0000000000000000000000000000000000000000
--- a/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx
+++ /dev/null
@@ -1,210 +0,0 @@
-import { Spinner } from "~/components/ui/spinner";
-import { useNavigate } from "@tanstack/react-router";
-import { useAtomValue } from "@effect/atom-react";
-import type { ServerProvider } from "@t3tools/contracts";
-import { CircleCheckIcon, DownloadIcon, TriangleAlertIcon, XIcon } from "lucide-react";
-import { useCallback, useEffect, useState, type CSSProperties } from "react";
-
-import { primaryServerProvidersAtom } from "../../state/server";
-import {
- getProviderUpdateSidebarPillView,
- type ProviderUpdateSidebarPillView,
-} from "../ProviderUpdateLaunchNotification.logic";
-import { Tooltip, TooltipPopup, TooltipTrigger } from "../ui/tooltip";
-
-const PROVIDER_UPDATE_PILL_STYLES = {
- loading:
- "bg-sidebar-control-surface text-sidebar-foreground group-has-[button[data-provider-update-main]:hover]/provider-update:bg-sidebar-row-hover",
- success:
- "bg-sidebar-control-surface text-sidebar-foreground group-has-[button[data-provider-update-main]:hover]/provider-update:bg-sidebar-row-hover",
- warning:
- "bg-warning/12 text-warning group-has-[button[data-provider-update-main]:hover]/provider-update:bg-warning/18",
- error:
- "bg-destructive/12 text-destructive group-has-[button[data-provider-update-main]:hover]/provider-update:bg-destructive/18",
-} as const;
-
-const PROVIDER_UPDATE_PILL_PROGRESS_STYLES = {
- success: "bg-foreground/8",
- warning: "bg-warning/14",
- error: "bg-destructive/14",
-} as const;
-
-function latestProviderCheckedAt(
- providers: ReadonlyArray
>,
-): string | undefined {
- return providers.reduce(
- (latest, provider) =>
- latest === undefined || provider.checkedAt > latest ? provider.checkedAt : latest,
- undefined,
- );
-}
-
-export function SidebarProviderUpdatePill() {
- const navigate = useNavigate();
- const providers = useAtomValue(primaryServerProvidersAtom);
- const [dismissedKeys, setDismissedKeys] = useState>(() => new Set());
- const [renderedView, setRenderedView] = useState(null);
- const [pendingView, setPendingView] = useState(null);
- const [exitingKey, setExitingKey] = useState(null);
- const [dismissAfterExitKey, setDismissAfterExitKey] = useState(null);
- const [visibleAfterIso, setVisibleAfterIso] = useState();
- const effectiveVisibleAfterIso = visibleAfterIso ?? latestProviderCheckedAt(providers);
- const view = getProviderUpdateSidebarPillView(providers, {
- ...(effectiveVisibleAfterIso !== undefined
- ? { visibleAfterIso: effectiveVisibleAfterIso }
- : {}),
- dismissedKeys,
- });
-
- useEffect(() => {
- if (visibleAfterIso === undefined && effectiveVisibleAfterIso !== undefined) {
- setVisibleAfterIso(effectiveVisibleAfterIso);
- }
- }, [effectiveVisibleAfterIso, visibleAfterIso]);
-
- const openProviderSettings = useCallback(() => {
- void navigate({ to: "/settings/providers" });
- }, [navigate]);
- const displayedView = renderedView ?? view;
- const dismissAfterVisibleMs = displayedView?.dismissAfterVisibleMs;
- const viewKey = displayedView?.key ?? null;
- const showDismissProgress =
- dismissAfterVisibleMs !== undefined &&
- displayedView?.tone !== "loading" &&
- exitingKey !== viewKey;
-
- const startExit = useCallback(
- (key: string, nextView: ProviderUpdateSidebarPillView | null, dismissKey?: string) => {
- if (exitingKey === key) {
- return;
- }
- setPendingView(nextView);
- setExitingKey(key);
- setDismissAfterExitKey(dismissKey ?? null);
- },
- [exitingKey],
- );
-
- useEffect(() => {
- if (exitingKey !== null) {
- return;
- }
- if (!renderedView) {
- if (view) {
- setRenderedView(view);
- }
- return;
- }
- if (!view) {
- startExit(renderedView.key, null);
- return;
- }
- if (view.key !== renderedView.key) {
- startExit(renderedView.key, view);
- return;
- }
- }, [exitingKey, renderedView, startExit, view]);
-
- useEffect(() => {
- if (!dismissAfterVisibleMs || !viewKey) {
- return;
- }
- if (exitingKey === viewKey) {
- return;
- }
- const timeoutId = window.setTimeout(() => {
- startExit(viewKey, null, viewKey);
- }, dismissAfterVisibleMs);
-
- return () => window.clearTimeout(timeoutId);
- }, [dismissAfterVisibleMs, exitingKey, startExit, viewKey]);
-
- if (!displayedView) {
- return null;
- }
-
- return (
- {
- if (event.target !== event.currentTarget) {
- return;
- }
- if (!displayedView || exitingKey !== displayedView.key) {
- return;
- }
- if (dismissAfterExitKey === displayedView.key) {
- setDismissedKeys((previous) => new Set(previous).add(displayedView.key));
- }
- setRenderedView(pendingView);
- setPendingView(null);
- setExitingKey(null);
- setDismissAfterExitKey(null);
- }}
- >
- {showDismissProgress ? (
-
- ) : null}
-
-
-
- {displayedView.tone === "loading" ? (
-
- ) : displayedView.tone === "success" ? (
-
- ) : displayedView.tone === "error" ? (
-
- ) : (
-
- )}
- {displayedView.title}
-
- }
- />
- {displayedView.description}
-
- {displayedView.dismissible && (
-
- startExit(displayedView.key, null, displayedView.key)}
- >
-
-
- }
- />
- Dismiss until provider status changes
-
- )}
-
+
Updates
+ {hasUpdates || run !== null ? (
+
) : null}
-
+
+ {isElectron ? (
+
+ {/* Icon column width; the download ring overflows it evenly. */}
+
+
+
+
+
App
+
+ {appStatus}
+
+
+
+
+
+ {getArm64IntelBuildWarningDescription(state)}
+
+ ) : null}
+ {state?.channel === "nightly" && state.releaseNotes.length > 0 ? (
+
+
+ Release notes
+
+
+
+ ) : null}
+ {everything.servers.map((server) => (
+
+ {server.serverLabel}
+ Server {server.targetVersion}
+
+ ))}
+ {runStatus ? (
+
+ {runStatus}
+
+ ) : null}
+ {everything.skipped.length > 0 ? (
+
+
+ Unavailable machines ({everything.skipped.length})
+
+
+ {everything.skipped.map((machine) => (
+ -
+ {machine.label}: {machine.reason}
+
+ ))}
+
+
+ ) : null}
void runEverything()}
/>
-
+
);
}
diff --git a/apps/web/src/components/sidebar/updateEverythingRun.tsx b/apps/web/src/components/sidebar/updateEverythingRun.tsx
index 0179e78acee272994a805d82ee242119ae9bb6ed..050c9a21c0032cdd29888fbb1530ced1f0132ff1 100644
--- a/apps/web/src/components/sidebar/updateEverythingRun.tsx
+++ b/apps/web/src/components/sidebar/updateEverythingRun.tsx
@@ -15,7 +15,7 @@ import {
type UpdateEverythingRun,
} from "./updateEverything.logic";
-/** The running "update everything" pass, or null. Outlives the sidebar button. */
+/** The running "update everything" pass, or null. Outlives the app menu. */
const updateEverythingRunAtom = Atom.make(null).pipe(
Atom.keepAlive,
Atom.withLabel("update-everything-run"),
@@ -133,7 +133,7 @@ export function DesktopUpdateLaunchNotice() {
stackedThreadToast({
type: "error",
title: "Update did not apply",
- description: `The Knife is still on ${APP_VERSION}. Install ${notAppliedVersion} again from the update button.`,
+ description: `The Knife is still on ${APP_VERSION}. Install ${notAppliedVersion} again from the app menu.`,
}),
);
}, [notAppliedVersion]);
diff --git a/apps/web/src/components/sidebar/useUpdateEverything.ts b/apps/web/src/components/sidebar/useUpdateEverything.ts
index 4f1333ee28613f9e9d8ec01ba67add14f85d1043..e980209b669dfd431b12ba7fbe0bbc02e51f986f 100644
--- a/apps/web/src/components/sidebar/useUpdateEverything.ts
+++ b/apps/web/src/components/sidebar/useUpdateEverything.ts
@@ -34,7 +34,7 @@ import {
export type ReportLocalUpdateError = (title: string, description: string) => void;
/**
- * The remote half of the sidebar update button: outdated providers on every
+ * The remote half of the app menu updater: outdated providers on every
* connected machine, and servers behind the version this client runs or is
* about to install (`localUpdateVersion`). Servers that install from npm appear
* only once npm confirms that version. `run` performs the whole pass, including
@@ -104,6 +104,7 @@ export function useUpdateEverything(localUpdateVersion: string | null) {
});
return {
+ servers,
hasUpdates: servers.length > 0 || providers.machines.length > 0,
/** Short label for the tooltip and the confirmation title. */
summary,
diff --git a/apps/web/src/components/threadSidebarWidth.test.ts b/apps/web/src/components/threadSidebarWidth.test.ts
index 41f6b97c928346150a98973e5d46b7351a8c5cf0..15f8f69448714e254a7d04f0004cc4e12b04e95b 100644
--- a/apps/web/src/components/threadSidebarWidth.test.ts
+++ b/apps/web/src/components/threadSidebarWidth.test.ts
@@ -2,35 +2,23 @@ import { describe, expect, it } from "vite-plus/test";
import {
clampThreadSidebarWidth,
resolveThreadSidebarMaximumWidth,
- resolveThreadSidebarMinimumWidth,
THREAD_SIDEBAR_MIN_WIDTH,
} from "./threadSidebarWidth";
-describe("resolveThreadSidebarMinimumWidth", () => {
- it("keeps the default minimum when the brand fits", () => {
- expect(resolveThreadSidebarMinimumWidth(0)).toBe(THREAD_SIDEBAR_MIN_WIDTH);
- expect(resolveThreadSidebarMinimumWidth(194)).toBe(THREAD_SIDEBAR_MIN_WIDTH);
- });
-
- it("grows to a brand wider than the default, rounding up", () => {
- expect(resolveThreadSidebarMinimumWidth(237.2)).toBe(238);
- });
-});
-
describe("resolveThreadSidebarMaximumWidth", () => {
- it("never drops below a raised minimum on a narrow viewport", () => {
- expect(resolveThreadSidebarMaximumWidth(800, 238)).toBe(238);
- expect(resolveThreadSidebarMaximumWidth(1200, 238)).toBe(560);
+ it("keeps the sidebar usable on a narrow viewport", () => {
+ expect(resolveThreadSidebarMaximumWidth(800)).toBe(THREAD_SIDEBAR_MIN_WIDTH);
+ expect(resolveThreadSidebarMaximumWidth(1200)).toBe(560);
});
});
describe("clampThreadSidebarWidth", () => {
- it("widens a stored width below a raised minimum", () => {
- expect(clampThreadSidebarWidth(208, 238, 560)).toBe(238);
+ it("widens a stored width below the minimum", () => {
+ expect(clampThreadSidebarWidth(180, 560)).toBe(THREAD_SIDEBAR_MIN_WIDTH);
});
it("keeps widths inside the range and caps wide ones", () => {
- expect(clampThreadSidebarWidth(300, 238, 560)).toBe(300);
- expect(clampThreadSidebarWidth(900, 238, 560)).toBe(560);
+ expect(clampThreadSidebarWidth(300, 560)).toBe(300);
+ expect(clampThreadSidebarWidth(900, 560)).toBe(560);
});
});
diff --git a/apps/web/src/components/threadSidebarWidth.ts b/apps/web/src/components/threadSidebarWidth.ts
index ea9967c1f06de55a47b8f11be2edcb8bbb97f4e8..c05ef438616e2f6847030b516deb901403cc2d58 100644
--- a/apps/web/src/components/threadSidebarWidth.ts
+++ b/apps/web/src/components/threadSidebarWidth.ts
@@ -3,24 +3,15 @@ const THREAD_SIDEBAR_DEFAULT_WIDTH = 16 * 16;
export const THREAD_SIDEBAR_MIN_WIDTH = 13 * 16;
export const THREAD_MAIN_CONTENT_MIN_WIDTH = 40 * 16;
-// The brand's measured width can raise the minimum so "T3 Code" never clips.
-export function resolveThreadSidebarMinimumWidth(brandWidth: number): number {
- return Math.max(THREAD_SIDEBAR_MIN_WIDTH, Math.ceil(brandWidth));
+export function resolveThreadSidebarMaximumWidth(viewportWidth: number): number {
+ return Math.max(
+ THREAD_SIDEBAR_MIN_WIDTH,
+ Math.floor(viewportWidth) - THREAD_MAIN_CONTENT_MIN_WIDTH,
+ );
}
-export function resolveThreadSidebarMaximumWidth(
- viewportWidth: number,
- minimumWidth = THREAD_SIDEBAR_MIN_WIDTH,
-): number {
- return Math.max(minimumWidth, Math.floor(viewportWidth) - THREAD_MAIN_CONTENT_MIN_WIDTH);
-}
-
-export function clampThreadSidebarWidth(
- width: number,
- minimumWidth: number,
- maximumWidth: number,
-): number {
- return Math.min(maximumWidth, Math.max(minimumWidth, width));
+export function clampThreadSidebarWidth(width: number, maximumWidth: number): number {
+ return Math.min(maximumWidth, Math.max(THREAD_SIDEBAR_MIN_WIDTH, width));
}
export function resolveInitialThreadSidebarWidth(
diff --git a/apps/web/src/components/ui/alert-dialog.focus.test.tsx b/apps/web/src/components/ui/alert-dialog.focus.test.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..33bb99ed67f03662ef6b3c7f2ec868944265ace6
--- /dev/null
+++ b/apps/web/src/components/ui/alert-dialog.focus.test.tsx
@@ -0,0 +1,88 @@
+// @vitest-environment jsdom
+
+import { act, createRef, useState } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { afterEach, beforeEach, expect, it, vi } from "vite-plus/test";
+
+import {
+ AlertDialog,
+ AlertDialogClose,
+ AlertDialogFooter,
+ AlertDialogPopup,
+ AlertDialogTitle,
+} from "./alert-dialog";
+import { Button } from "./button";
+
+let root: Root;
+let container: HTMLDivElement;
+const cancel = createRef();
+
+beforeEach(() => {
+ vi.stubGlobal("IS_REACT_ACT_ENVIRONMENT", true);
+ container = document.createElement("div");
+ document.body.append(container);
+ root = createRoot(container);
+});
+
+afterEach(async () => {
+ await act(async () => root.unmount());
+ container.remove();
+ vi.unstubAllGlobals();
+});
+
+function Confirmation({ disabled = false, explicitFocus = false }) {
+ const [open, setOpen] = useState(false);
+ return (
+ <>
+
+
+
+ Remove fixture?
+
+ }>
+ Cancel
+
+
+
+
+
+
+ );
+}
+
+async function open() {
+ const trigger = container.querySelector("button")!;
+ await act(async () => {
+ trigger.focus();
+ trigger.click();
+ });
+}
+
+it("focuses confirmation on every opening and lets Escape cancel", async () => {
+ await act(async () => root.render());
+ await open();
+ await vi.waitFor(() => expect(document.activeElement?.textContent).toBe("Remove"));
+ await act(async () => {
+ document.activeElement?.dispatchEvent(
+ new KeyboardEvent("keydown", { key: "Escape", bubbles: true }),
+ );
+ });
+ await vi.waitFor(() => expect(document.querySelector('[role="alertdialog"]')).toBeNull());
+ expect(document.activeElement?.textContent).toBe("Open danger dialog");
+ await open();
+ await vi.waitFor(() => expect(document.activeElement?.textContent).toBe("Remove"));
+});
+
+it("keeps disabled confirmation out of the default keyboard action", async () => {
+ await act(async () => root.render());
+ await open();
+ await vi.waitFor(() => expect(document.activeElement?.textContent).toBe("Cancel"));
+});
+
+it("preserves an explicit initial focus target", async () => {
+ await act(async () => root.render());
+ await open();
+ await vi.waitFor(() => expect(document.activeElement?.textContent).toBe("Cancel"));
+});
diff --git a/apps/web/src/components/ui/alert-dialog.tsx b/apps/web/src/components/ui/alert-dialog.tsx
index bef8c3223b9af7bd8147ff31aac05c210d2dbeaa..493a33abc3529f4c4db605195ff75a2ea300e2eb 100644
--- a/apps/web/src/components/ui/alert-dialog.tsx
+++ b/apps/web/src/components/ui/alert-dialog.tsx
@@ -1,6 +1,7 @@
"use client";
import { AlertDialog as AlertDialogPrimitive } from "@base-ui/react/alert-dialog";
+import { useRef } from "react";
import { cn } from "~/lib/utils";
import {
@@ -41,11 +42,14 @@ function AlertDialogPopup({
className,
bottomStickOnMobile = true,
portalContainer,
+ initialFocus,
+ ref,
...props
}: AlertDialogPrimitive.Popup.Props & {
bottomStickOnMobile?: boolean;
portalContainer?: AlertDialogPrimitive.Portal.Props["container"];
}) {
+ const popup = useRef(null);
return (
@@ -53,6 +57,21 @@ function AlertDialogPopup({
className={cn(bottomStickOnMobile && "max-sm:grid-rows-[1fr_auto] max-sm:p-0 max-sm:pt-12")}
>
{
+ popup.current = element;
+ if (typeof ref === "function") return ref(element);
+ if (ref) ref.current = element;
+ }}
+ initialFocus={
+ initialFocus ??
+ (() => {
+ return (
+ popup.current?.querySelector(
+ '[data-slot="alert-dialog-footer"] button:not([data-slot="alert-dialog-close"]):not(:disabled):not([aria-disabled="true"])',
+ ) ?? true
+ );
+ })
+ }
className={cn(
DIALOG_POPUP_CLASS,
"row-start-2 max-h-full max-w-lg text-popover-foreground",
diff --git a/apps/web/src/hooks/useNewProject.ts b/apps/web/src/hooks/useNewProject.ts
deleted file mode 100644
index 6c148079cab3e3a9600aace87dfb6eb53e3e2c25..0000000000000000000000000000000000000000
--- a/apps/web/src/hooks/useNewProject.ts
+++ /dev/null
@@ -1,151 +0,0 @@
-import { scopeProjectRef } from "@t3tools/client-runtime/environment";
-import {
- getNewProjectRepository,
- type NewProjectPublishTarget,
-} from "@t3tools/client-runtime/operations/projects";
-import {
- isAtomCommandInterrupted,
- squashAtomCommandFailure,
-} from "@t3tools/client-runtime/state/runtime";
-import type { EnvironmentId } from "@t3tools/contracts";
-import { useCallback } from "react";
-
-import { stackedThreadToast, toastManager } from "~/components/ui/toast";
-import { waitForProject } from "~/state/entities";
-import { projectEnvironment } from "~/state/projects";
-import { sourceControlEnvironment } from "~/state/sourceControl";
-import { useAtomCommand } from "~/state/use-atom-command";
-import { useNewThreadHandler } from "./useHandleNewThread";
-
-function errorMessage(error: unknown): string {
- return error instanceof Error && error.message.trim().length > 0
- ? error.message
- : "An error occurred.";
-}
-
-/**
- * Starts a project from just a name. The server makes a folder under its
- * `newProjectsRoot` with a README, an icon, and a first commit; this then
- * opens a new thread draft in it. With `publishTo`, it also publishes the
- * repository as private on that host, without holding up the draft.
- *
- * Resolves to whether the project was created.
- */
-export function useNewProject() {
- const createNew = useAtomCommand(projectEnvironment.createNew, { reportFailure: false });
- const publishRepository = useAtomCommand(sourceControlEnvironment.publishRepository, {
- reportFailure: false,
- });
- const handleNewThread = useNewThreadHandler();
-
- const publishNewRepository = useCallback(
- async (input: {
- readonly environmentId: EnvironmentId;
- readonly workspaceRoot: string;
- readonly target: NewProjectPublishTarget;
- }) => {
- const { label } = input.target.definition;
- const result = await publishRepository({
- environmentId: input.environmentId,
- input: {
- cwd: input.workspaceRoot,
- provider: input.target.definition.kind,
- repository: getNewProjectRepository(input.target, input.workspaceRoot),
- visibility: "private",
- },
- });
- if (result._tag === "Failure") {
- if (!isAtomCommandInterrupted(result)) {
- toastManager.add(
- stackedThreadToast({
- type: "error",
- title: `Could not create the ${label} repository`,
- description: `${errorMessage(squashAtomCommandFailure(result))} Use Publish Repository in the Git menu to try again.`,
- }),
- );
- }
- return;
- }
- toastManager.add(
- stackedThreadToast({
- type: "success",
- title: `Published to ${label}`,
- description: result.value.repository.nameWithOwner,
- }),
- );
- },
- [publishRepository],
- );
-
- return useCallback(
- async (input: {
- readonly environmentId: EnvironmentId;
- readonly name: string;
- readonly publishTo: NewProjectPublishTarget | null;
- }): Promise => {
- const result = await createNew({
- environmentId: input.environmentId,
- input: { name: input.name },
- });
- if (result._tag === "Failure") {
- if (!isAtomCommandInterrupted(result)) {
- toastManager.add(
- stackedThreadToast({
- type: "error",
- title: "Could not create the project",
- description: errorMessage(squashAtomCommandFailure(result)),
- }),
- );
- }
- return false;
- }
-
- const { projectId, workspaceRoot, commitError } = result.value;
- // The folder sits in T3 Code's data directory, so always say where.
- toastManager.add(
- stackedThreadToast(
- commitError === undefined
- ? { type: "success", title: `Created ${input.name}`, description: workspaceRoot }
- : {
- type: "warning",
- title: `Created ${input.name} without a first commit`,
- description: `${commitError} The project is in ${workspaceRoot}.`,
- },
- ),
- );
- if (input.publishTo) {
- void publishNewRepository({
- environmentId: input.environmentId,
- workspaceRoot,
- target: input.publishTo,
- });
- }
-
- const projectRef = scopeProjectRef(input.environmentId, projectId);
- // Drafts key off the project's stored path, so wait for the create event
- // to reach the store before opening one.
- const project = await waitForProject(projectRef).catch((error: unknown) => {
- toastManager.add(
- stackedThreadToast({
- type: "error",
- title: "Failed to open project",
- description: `${errorMessage(error)} It will appear in the sidebar once this client catches up.`,
- }),
- );
- return null;
- });
- if (project === null) return true;
- await handleNewThread(projectRef).catch((error: unknown) => {
- toastManager.add(
- stackedThreadToast({
- type: "error",
- title: "Failed to open project",
- description: errorMessage(error),
- }),
- );
- });
- return true;
- },
- [createNew, handleNewThread, publishNewRepository],
- );
-}
diff --git a/apps/web/src/index.css b/apps/web/src/index.css
index 90f204d201fe8b65810bcb6c317f88e675218c17..9ac126d6b766239cdbd6cc8b4ff8c99607b6377f 100644
--- a/apps/web/src/index.css
+++ b/apps/web/src/index.css
@@ -1,5 +1,37 @@
@import "tailwindcss";
+@font-face {
+ font-family: "AT Name Sans";
+ src: url("/fonts/private/ATNameSans-Regular.woff2") format("woff2");
+ font-weight: 1 1000;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: "AT Name Sans";
+ src: url("/fonts/private/ATNameSans-Italic.woff2") format("woff2");
+ font-weight: 1 1000;
+ font-style: italic;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: "AT Name Mono";
+ src: url("/fonts/private/ATNameMono-Regular.woff2") format("woff2");
+ font-weight: 400 900;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: "AT Name Mono";
+ src: url("/fonts/private/ATNameMono-Italic.woff2") format("woff2");
+ font-weight: 400 900;
+ font-style: italic;
+ font-display: swap;
+}
+
@custom-variant dark (&:is(.dark, .dark *));
@custom-variant light (&:not(.dark, .dark *));
/* Window Controls Overlay: active when Electron exposes native titlebar control geometry. */
@@ -87,6 +119,7 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
}
:root {
+ --clo-term-font: "AT Name Mono";
--app-scrollbar-width: 6px;
--appearance-contrast-base: 100%;
--appearance-contrast-boost: 0%;
@@ -164,9 +197,9 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
the variables and Settings -> Appearance can override them at runtime. The
default stacks are mirrored in `appearanceFonts.ts`. */
@theme {
- --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
+ --font-sans: "AT Name Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
--font-mono:
- ui-monospace, "SF Mono", "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
+ "AT Name Mono", "SF Mono", "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
}
@theme inline {
@@ -493,31 +526,6 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
var(--app-scrollbar-width) 100%;
}
-/* Stage-channel art needs a mask and pseudo-element gradient, so keep the
- behavior composable without tying it to the global components layer. */
-@utility sidebar-stage-backdrop {
- --stage-fade: var(--sidebar-stage-fade, var(--app-chrome-background));
- mask-image: linear-gradient(to bottom, black 0%, black 55%, transparent 92%);
- -webkit-mask-image: linear-gradient(to bottom, black 0%, black 55%, transparent 92%);
-
- &::after {
- content: "";
- position: absolute;
- inset: 0;
- background: linear-gradient(
- to bottom,
- transparent 0%,
- transparent 28%,
- color-mix(in srgb, var(--stage-fade) 10%, transparent) 40%,
- color-mix(in srgb, var(--stage-fade) 30%, transparent) 52%,
- color-mix(in srgb, var(--stage-fade) 58%, transparent) 64%,
- color-mix(in srgb, var(--stage-fade) 82%, transparent) 75%,
- color-mix(in srgb, var(--stage-fade) 96%, transparent) 85%,
- var(--stage-fade) 93%
- );
- }
-}
-
@keyframes live-tool-shine {
from {
background-position:
@@ -1146,7 +1154,6 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
--sidebar-row-active: var(--color-white);
--sidebar-row-selected: var(--color-white);
--sidebar-border: var(--border);
- --sidebar-stage-fade: var(--sidebar);
--code-background: color-mix(in srgb, var(--card) 90%, var(--background));
--code-foreground: var(--foreground);
--terminal-background: var(--background);
@@ -1189,7 +1196,6 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
--sidebar-row-hover: var(--accent);
--sidebar-row-active: var(--accent);
--sidebar-row-selected: var(--muted);
- --sidebar-stage-fade: var(--card);
--terminal-cursor: rgb(180 203 255);
--terminal-selection-background: rgb(180 203 255 / 25%);
}
@@ -1217,7 +1223,6 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
--sidebar-row-active: var(--color-white);
--sidebar-row-selected: var(--color-white);
--sidebar-border: var(--color-zinc-200);
- --sidebar-stage-fade: var(--sidebar);
@variant dark {
--background: #000;
@@ -1238,7 +1243,6 @@ html[data-mobile-composer-route-transition="true"]::view-transition-old(t3-mobil
--sidebar-row-active: color-mix(in srgb, var(--contrast-foreground) 11%, transparent);
--sidebar-row-selected: color-mix(in srgb, var(--contrast-foreground) 7%, transparent);
--sidebar-border: var(--border);
- --sidebar-stage-fade: var(--card);
}
}
@@ -1307,7 +1311,6 @@ html[data-theme-id]:not([data-theme-id=""]) {
--sidebar-row-active: var(--app-theme-sidebar-row-active);
--sidebar-row-selected: var(--app-theme-sidebar-row-selected);
--sidebar-border: var(--app-theme-sidebar-border);
- --sidebar-stage-fade: var(--app-theme-sidebar);
--code-background: var(--app-theme-code-background);
--code-foreground: var(--app-theme-code-foreground);
--terminal-background: var(--app-theme-terminal-background);
@@ -1507,7 +1510,6 @@ html[data-theme-id] [data-app-sidebar] {
--sidebar-row-active: var(--app-theme-sidebar-row-active);
--sidebar-row-selected: var(--app-theme-sidebar-row-selected);
--sidebar-border: var(--app-theme-sidebar-border);
- --sidebar-stage-fade: var(--app-theme-sidebar);
border-color: color-mix(in srgb, var(--contrast-sidebar-foreground) 10%, transparent);
@variant dark {
diff --git a/apps/web/src/rightPanelStore.test.ts b/apps/web/src/rightPanelStore.test.ts
index 961a4a178dac963de81002452c3820444a186956..13f9e1ca4ea6a696364027dd38ffd499291ec1af 100644
--- a/apps/web/src/rightPanelStore.test.ts
+++ b/apps/web/src/rightPanelStore.test.ts
@@ -565,7 +565,7 @@ describe("rightPanelStore", () => {
).toEqual({
byThreadKey: {},
threadPanelVisibilityByThreadKey: {
- "env-1:thread-A": { inlineOpen: false, popoverOpen: false },
+ "env-1:thread-B": { inlineOpen: true, popoverOpen: false },
},
});
});
@@ -574,13 +574,13 @@ describe("rightPanelStore", () => {
const store = useRightPanelStore.getState();
expect(selectThreadPanelOpen(store.threadPanelVisibilityByThreadKey, refA, "inline")).toBe(
- true,
+ false,
);
expect(selectThreadPanelOpen(store.threadPanelVisibilityByThreadKey, refA, "popover")).toBe(
false,
);
- store.setThreadPanelOpen(refA, "inline", false);
+ store.toggleThreadPanel(refA, "inline");
store.toggleThreadPanel(refA, "popover");
expect(
@@ -588,13 +588,13 @@ describe("rightPanelStore", () => {
useRightPanelStore.getState().threadPanelVisibilityByThreadKey,
refA,
),
- ).toEqual({ inlineOpen: false, popoverOpen: true });
+ ).toEqual({ inlineOpen: true, popoverOpen: true });
expect(
selectThreadPanelVisibility(
useRightPanelStore.getState().threadPanelVisibilityByThreadKey,
refB,
),
- ).toEqual({ inlineOpen: true, popoverOpen: false });
+ ).toEqual({ inlineOpen: false, popoverOpen: false });
});
it("closes the popover atomically when the real right panel opens", () => {
@@ -606,7 +606,7 @@ describe("rightPanelStore", () => {
useRightPanelStore.getState().threadPanelVisibilityByThreadKey,
refA,
),
- ).toEqual({ inlineOpen: true, popoverOpen: false });
+ ).toEqual({ inlineOpen: false, popoverOpen: false });
});
it("keeps an open popover visible by promoting it to inline when the real panel closes", () => {
diff --git a/apps/web/src/rightPanelStore.ts b/apps/web/src/rightPanelStore.ts
index fa417786a019cf83a3b142b1a968df5adb83a47c..0ab7794d87386ed209ab29c95074613678f9a280 100644
--- a/apps/web/src/rightPanelStore.ts
+++ b/apps/web/src/rightPanelStore.ts
@@ -209,7 +209,7 @@ const EMPTY_THREAD_STATE: ThreadRightPanelState = {
};
const DEFAULT_THREAD_PANEL_VISIBILITY: ThreadPanelVisibility = {
- inlineOpen: true,
+ inlineOpen: false,
popoverOpen: false,
};
@@ -340,7 +340,7 @@ const updateThreadPanelVisibilityMap = (
): Record => {
const current = byThreadKey[threadKey] ?? DEFAULT_THREAD_PANEL_VISIBILITY;
const next = updater(current);
- if (next.inlineOpen && !next.popoverOpen) {
+ if (next.inlineOpen === DEFAULT_THREAD_PANEL_VISIBILITY.inlineOpen && !next.popoverOpen) {
if (!(threadKey in byThreadKey)) return byThreadKey;
const { [threadKey]: _removed, ...rest } = byThreadKey;
return rest;
@@ -589,8 +589,9 @@ export function migratePersistedRightPanelState(persistedState: unknown): {
persistedState.threadPanelVisibilityByThreadKey as Record,
).flatMap(([threadKey, value]) => {
if (!value || typeof value !== "object" || !("inlineOpen" in value)) return [];
- return value.inlineOpen === false
- ? [[threadKey, { inlineOpen: false, popoverOpen: false }]]
+ return typeof value.inlineOpen === "boolean" &&
+ value.inlineOpen !== DEFAULT_THREAD_PANEL_VISIBILITY.inlineOpen
+ ? [[threadKey, { inlineOpen: value.inlineOpen, popoverOpen: false }]]
: [];
}),
)
@@ -1068,7 +1069,9 @@ export const useRightPanelStore = create()(
threadPanelVisibilityByThreadKey: Object.fromEntries(
Object.entries(state.threadPanelVisibilityByThreadKey).flatMap(
([threadKey, visibility]) =>
- visibility.inlineOpen ? [] : [[threadKey, { inlineOpen: false, popoverOpen: false }]],
+ visibility.inlineOpen === DEFAULT_THREAD_PANEL_VISIBILITY.inlineOpen
+ ? []
+ : [[threadKey, { inlineOpen: visibility.inlineOpen, popoverOpen: false }]],
),
),
}),