Skip to content

Commit 712bd74

Browse files
skoshxskoshx
committed
fix: bunch of fixes
1 parent f3856c8 commit 712bd74

50 files changed

Lines changed: 1828 additions & 2296 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎apps/cli/src/components/app.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ export const App = ({ agent }: { agent: AgentBackend }) => {
114114
changesFor={screen.changesFor}
115115
instruction={screen.instruction}
116116
savedFlow={screen.savedFlow}
117-
cookieBrowserKeys={screen.cookieBrowserKeys}
117+
cookieImportProfiles={screen.cookieImportProfiles}
118118
/>
119119
);
120120
case "Testing":
@@ -123,7 +123,7 @@ export const App = ({ agent }: { agent: AgentBackend }) => {
123123
changesFor={screen.changesFor}
124124
instruction={screen.instruction}
125125
savedFlow={screen.savedFlow}
126-
cookieBrowserKeys={screen.cookieBrowserKeys}
126+
cookieImportProfiles={screen.cookieImportProfiles}
127127
baseUrls={screen.baseUrls}
128128
/>
129129
);
@@ -153,7 +153,7 @@ export const App = ({ agent }: { agent: AgentBackend }) => {
153153
<WatchScreen
154154
changesFor={screen.changesFor}
155155
instruction={screen.instruction}
156-
cookieBrowserKeys={screen.cookieBrowserKeys}
156+
cookieImportProfiles={screen.cookieImportProfiles}
157157
baseUrl={screen.baseUrl}
158158
/>
159159
);

‎apps/cli/src/components/screens/cookie-sync-confirm-screen.tsx‎

Lines changed: 37 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,21 @@
11
import { useEffect, useRef, useState } from "react";
22
import { Box, Text, useInput } from "ink";
3+
import { Option } from "effect";
34
import figures from "figures";
45
import type { ChangesFor, SavedFlow } from "@expect/shared/models";
5-
import { trackEvent } from "../../utils/session-analytics";
6-
import { useColors } from "../theme-context";
6+
import { Clickable } from "../ui/clickable";
77
import { Logo } from "../ui/logo";
88
import { Spinner } from "../ui/spinner";
9-
import { Clickable } from "../ui/clickable";
9+
import { useColors } from "../theme-context";
10+
import { trackEvent } from "../../utils/session-analytics";
1011
import {
1112
useNavigationStore,
1213
Screen,
1314
screenForTestingOrPortPicker,
1415
} from "../../stores/use-navigation";
1516
import { useProjectPreferencesStore } from "../../stores/use-project-preferences";
16-
import { useInstalledBrowsers, type DetectedBrowser } from "../../hooks/use-installed-browsers";
17+
import { useInstalledBrowsers } from "../../hooks/use-installed-browsers";
18+
1719

1820
interface CookieSyncConfirmScreenProps {
1921
changesFor?: ChangesFor;
@@ -28,51 +30,52 @@ export const CookieSyncConfirmScreen = ({
2830
}: CookieSyncConfirmScreenProps) => {
2931
const COLORS = useColors();
3032
const setScreen = useNavigationStore((state) => state.setScreen);
31-
const setCookieBrowserKeys = useProjectPreferencesStore((state) => state.setCookieBrowserKeys);
32-
const { data: browsers, isLoading } = useInstalledBrowsers();
33+
const setCookieImportProfiles = useProjectPreferencesStore(
34+
(state) => state.setCookieImportProfiles,
35+
);
36+
const { data, isLoading } = useInstalledBrowsers();
3337

3438
const [highlightedIndex, setHighlightedIndex] = useState(0);
35-
const [selectedKeys, setSelectedKeys] = useState<Set<string>>(new Set());
39+
const [selectedIds, setSelectedIds] = useState<Set<string>>(new Set());
3640
const defaultsInitialized = useRef(false);
3741

38-
const items: DetectedBrowser[] = browsers ?? [];
42+
const items = data?.browsers ?? [];
3943
const itemCount = items.length;
4044

4145
useEffect(() => {
42-
if (defaultsInitialized.current || !browsers || browsers.length === 0) return;
46+
if (defaultsInitialized.current || !data || data.browsers.length === 0) return;
4347
defaultsInitialized.current = true;
44-
const defaultBrowser = browsers.find((browser) => browser.isDefault);
45-
if (defaultBrowser) {
46-
setSelectedKeys(new Set([defaultBrowser.key]));
48+
if (Option.isSome(data.default)) {
49+
setSelectedIds(new Set([data.default.value.id]));
4750
}
48-
}, [browsers]);
51+
}, [data]);
4952

50-
const toggleKey = (key: string) => {
51-
setSelectedKeys((previous) => {
53+
const toggleId = (id: string) => {
54+
setSelectedIds((previous) => {
5255
const next = new Set(previous);
53-
if (next.has(key)) {
54-
next.delete(key);
56+
if (next.has(id)) {
57+
next.delete(id);
5558
} else {
56-
next.add(key);
59+
next.add(id);
5760
}
5861
return next;
5962
});
6063
};
6164

6265
const confirm = () => {
63-
const keys = [...selectedKeys];
64-
setCookieBrowserKeys(keys);
66+
const selectedProfiles = items.filter((browser) => selectedIds.has(browser.id));
67+
setCookieImportProfiles(selectedProfiles);
6568
trackEvent("cookies:browser_selection", {
66-
selected_count: keys.length,
67-
browsers: keys.join(","),
69+
selected_count: selectedProfiles.length,
70+
browsers: selectedProfiles.map((browser) => browser.displayName).join(", "),
6871
});
6972
if (changesFor && instruction) {
7073
setScreen(
7174
screenForTestingOrPortPicker({
7275
changesFor,
7376
instruction,
7477
savedFlow,
75-
cookieBrowserKeys: keys,
78+
cookieImportProfiles: selectedProfiles,
7679
}),
7780
);
7881
} else {
@@ -93,16 +96,15 @@ export const CookieSyncConfirmScreen = ({
9396

9497
if (input === " " && itemCount > 0) {
9598
const item = items[highlightedIndex];
96-
if (item) toggleKey(item.key);
99+
if (item) toggleId(item.id);
97100
}
98101

99102
if (input === "a") {
100-
const allKeys = items.map((browser) => browser.key);
101-
setSelectedKeys(new Set(allKeys));
103+
setSelectedIds(new Set(items.map((browser) => browser.id)));
102104
}
103105

104106
if (input === "n") {
105-
setSelectedKeys(new Set());
107+
setSelectedIds(new Set());
106108
}
107109

108110
if (key.return) {
@@ -114,7 +116,7 @@ export const CookieSyncConfirmScreen = ({
114116
}
115117
});
116118

117-
const selectedCount = selectedKeys.size;
119+
const selectedCount = selectedIds.size;
118120

119121
return (
120122
<Box flexDirection="column" width="100%" paddingY={1} paddingX={1}>
@@ -150,15 +152,18 @@ export const CookieSyncConfirmScreen = ({
150152
{!isLoading && (
151153
<Box flexDirection="column" marginTop={1}>
152154
{items.map((browser, index) => {
155+
const id = browser.id;
153156
const isHighlighted = index === highlightedIndex;
154-
const isSelected = selectedKeys.has(browser.key);
157+
const isSelected = selectedIds.has(id);
158+
const isDefault =
159+
Option.isSome(data!.default) && data!.default.value.id === id;
155160

156161
return (
157162
<Clickable
158-
key={browser.key}
163+
key={id}
159164
onClick={() => {
160165
setHighlightedIndex(index);
161-
toggleKey(browser.key);
166+
toggleId(id);
162167
}}
163168
>
164169
<Box>
@@ -171,7 +176,7 @@ export const CookieSyncConfirmScreen = ({
171176
<Text color={isHighlighted ? COLORS.PRIMARY : COLORS.TEXT} bold={isHighlighted}>
172177
{browser.displayName}
173178
</Text>
174-
{browser.isDefault && <Text color={COLORS.DIM}> (default)</Text>}
179+
{isDefault && <Text color={COLORS.DIM}> (default)</Text>}
175180
</Box>
176181
</Clickable>
177182
);

‎apps/cli/src/components/screens/main-menu-screen.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -72,9 +72,9 @@ export const MainMenu = ({ gitState }: MainMenuProps) => {
7272
const [errorMessage, setErrorMessage] = useState<string | undefined>(undefined);
7373
const [historyIndex, setHistoryIndex] = useState(-1);
7474
const [savedCurrentInput, setSavedCurrentInput] = useState("");
75-
const cookieBrowserKeys = useProjectPreferencesStore((state) => state.cookieBrowserKeys);
76-
const clearCookieBrowserKeys = useProjectPreferencesStore(
77-
(state) => state.clearCookieBrowserKeys,
75+
const cookieImportProfiles = useProjectPreferencesStore((state) => state.cookieImportProfiles);
76+
const clearCookieImportProfiles = useProjectPreferencesStore(
77+
(state) => state.clearCookieImportProfiles,
7878
);
7979
const { data: testCoverage } = useTestCoverage(gitState);
8080

@@ -153,12 +153,12 @@ export const MainMenu = ({ gitState }: MainMenuProps) => {
153153

154154
usePreferencesStore.getState().rememberInstruction(trimmed);
155155

156-
if (cookieBrowserKeys.length > 0 || containsUrl(trimmed)) {
156+
if (cookieImportProfiles.length > 0 || containsUrl(trimmed)) {
157157
setScreen(
158158
screenForTestingOrPortPicker({
159159
changesFor,
160160
instruction: trimmed,
161-
cookieBrowserKeys,
161+
cookieImportProfiles,
162162
}),
163163
);
164164
} else {
@@ -225,8 +225,8 @@ export const MainMenu = ({ gitState }: MainMenuProps) => {
225225
}
226226

227227
if (key.ctrl && input === "k") {
228-
if (cookieBrowserKeys.length > 0) {
229-
clearCookieBrowserKeys();
228+
if (cookieImportProfiles.length > 0) {
229+
clearCookieImportProfiles();
230230
trackEvent("cookies:cleared");
231231
} else {
232232
setScreen(Screen.CookieSyncConfirm({}));

‎apps/cli/src/components/screens/port-picker-screen.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { useState } from "react";
22
import { Box, Text, useInput } from "ink";
33
import figures from "figures";
44
import type { ChangesFor, SavedFlow } from "@expect/shared/models";
5+
import type { Browser } from "@expect/cookies";
56
import { PORT_PICKER_VISIBLE_COUNT } from "../../constants";
67
import { useColors } from "../theme-context";
78
import { useNavigationStore, Screen } from "../../stores/use-navigation";
@@ -18,7 +19,7 @@ interface PortPickerScreenProps {
1819
changesFor: ChangesFor;
1920
instruction: string;
2021
savedFlow?: SavedFlow;
21-
cookieBrowserKeys?: readonly string[];
22+
cookieImportProfiles?: readonly Browser[];
2223
}
2324

2425
interface PortEntry {
@@ -62,7 +63,7 @@ export const PortPickerScreen = ({
6263
changesFor,
6364
instruction,
6465
savedFlow,
65-
cookieBrowserKeys,
66+
cookieImportProfiles,
6667
}: PortPickerScreenProps) => {
6768
const COLORS = useColors();
6869
const setScreen = useNavigationStore((state) => state.setScreen);
@@ -122,7 +123,7 @@ export const PortPickerScreen = ({
122123
changesFor,
123124
instruction,
124125
savedFlow,
125-
cookieBrowserKeys,
126+
cookieImportProfiles,
126127
baseUrls: allUrls.length > 0 ? allUrls : undefined,
127128
}),
128129
);

‎apps/cli/src/components/screens/saved-flow-picker-screen.tsx‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -32,9 +32,7 @@ const selectFlow = (flow: SavedFlowFileData, mainBranch: string) => {
3232
userInstruction: flow.flow.userInstruction,
3333
steps,
3434
};
35-
const storedKeys = useProjectPreferencesStore.getState().cookieBrowserKeys;
36-
const cookieBrowserKeys =
37-
flow.environment.cookies && storedKeys.length === 0 ? ["chrome"] : storedKeys;
35+
const cookieImportProfiles = useProjectPreferencesStore.getState().cookieImportProfiles;
3836

3937
trackEvent("flow:reused", { slug: flow.slug, step_count: steps.length });
4038

@@ -43,7 +41,7 @@ const selectFlow = (flow: SavedFlowFileData, mainBranch: string) => {
4341
changesFor,
4442
instruction: flow.flow.userInstruction,
4543
savedFlow,
46-
cookieBrowserKeys,
44+
cookieImportProfiles,
4745
}),
4846
);
4947
};

‎apps/cli/src/components/screens/testing-screen.tsx‎

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,9 @@ import cliTruncate from "cli-truncate";
2929
import { formatElapsedTime } from "../../utils/format-elapsed-time";
3030
import { Image } from "../ui/image";
3131
import { ErrorMessage } from "../ui/error-message";
32-
import { executeFn, screenshotPathsAtom } from "../../data/execution-atom";
32+
import { LIVE_VIEWER_STATIC_URL } from "@expect/shared";
33+
import type { Browser } from "@expect/cookies";
34+
import { executeAtomFn, screenshotPathsAtom } from "../../data/execution-atom";
3335
import { agentConfigOptionsAtom } from "../../data/config-options";
3436
import { agentProviderAtom } from "../../data/runtime";
3537
import { trackEvent } from "../../utils/session-analytics";
@@ -44,7 +46,7 @@ interface TestingScreenProps {
4446
changesFor: ChangesFor;
4547
instruction: string;
4648
savedFlow?: SavedFlow;
47-
cookieBrowserKeys?: readonly string[];
49+
cookieImportProfiles?: readonly Browser[];
4850
baseUrls?: readonly string[];
4951
}
5052

@@ -273,7 +275,7 @@ export const TestingScreen = ({
273275
changesFor,
274276
instruction,
275277
savedFlow,
276-
cookieBrowserKeys = [],
278+
cookieImportProfiles = [],
277279
baseUrls,
278280
}: TestingScreenProps) => {
279281
const setScreen = useNavigationStore((state) => state.setScreen);
@@ -295,11 +297,10 @@ export const TestingScreen = ({
295297
const toggleNotifications = usePreferencesStore(
296298
(state) => state.toggleNotifications
297299
);
298-
const [executionResult, triggerExecute] = useAtom(executeFn, {
300+
const [executionResult, triggerExecute] = useAtom(executeAtomFn, {
299301
mode: "promiseExit",
300302
});
301303
const screenshotPaths = useAtomValue(screenshotPathsAtom);
302-
const [liveViewUrl, setLiveViewUrl] = useState<string | undefined>(undefined);
303304

304305
const isExecuting = AsyncResult.isWaiting(executionResult);
305306
const isExecutionComplete = AsyncResult.isSuccess(executionResult);
@@ -465,12 +466,13 @@ export const TestingScreen = ({
465466
? `${instruction} ${urlTags}`
466467
: instruction;
467468

469+
console.error("[TestingScreen] cookieImportProfiles:", JSON.stringify(cookieImportProfiles.map((p: any) => ({ _tag: p._tag, constructor: p.constructor?.name }))));
468470
triggerExecute({
469471
options: {
470472
changesFor,
471473
instruction: instructionWithUrls,
472474
isHeadless: !browserHeaded,
473-
cookieBrowserKeys: [...cookieBrowserKeys],
475+
cookieImportProfiles: [...cookieImportProfiles],
474476
savedFlow,
475477
baseUrl,
476478
modelPreference:
@@ -480,7 +482,6 @@ export const TestingScreen = ({
480482
},
481483
agentBackend,
482484
onUpdate: setExecutedPlan,
483-
onReplayUrl: setLiveViewUrl,
484485
onConfigOptions: (configOptions) => {
485486
setConfigOptions((previous) => ({
486487
...previous,
@@ -499,7 +500,7 @@ export const TestingScreen = ({
499500
changesFor,
500501
instruction,
501502
savedFlow,
502-
cookieBrowserKeys,
503+
cookieImportProfiles,
503504
baseUrls,
504505
modelPreferenceConfigId,
505506
modelPreferenceValue,
@@ -563,11 +564,11 @@ export const TestingScreen = ({
563564
return;
564565
}
565566

566-
if (normalizedInput === "o" && !key.ctrl && !key.meta && liveViewUrl) {
567+
if (normalizedInput === "o" && !key.ctrl && !key.meta && executedPlan?.id) {
567568
const { exec } =
568569
require("node:child_process") as typeof import("node:child_process");
569-
const escapedUrl = liveViewUrl.replace(/"/g, '\\"');
570-
exec(`open "${escapedUrl}"`);
570+
const url = `${LIVE_VIEWER_STATIC_URL}?testId=${executedPlan.id}`;
571+
exec(`open "${url}"`);
571572
trackEvent("live_preview:opened");
572573
return;
573574
}
@@ -636,7 +637,7 @@ export const TestingScreen = ({
636637
</Text>
637638
</Box>
638639

639-
{liveViewUrl && isExecuting && (
640+
{executedPlan?.id && isExecuting && (
640641
<Box marginTop={0}>
641642
<Text color={COLORS.PRIMARY} bold>
642643
{" "}Press{" "}

0 commit comments

Comments
 (0)