Skip to content

Commit c0582f2

Browse files
refactor: update survey (#653)
1 parent 381472a commit c0582f2

33 files changed

+657
-290
lines changed

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@
3333
"@zenml-io/react-component-library": "^0.18.0",
3434
"awesome-debounce-promise": "^2.1.0",
3535
"class-variance-authority": "^0.7.0",
36+
"clsx": "^2.1.1",
3637
"immer": "^10.1.1",
3738
"lodash.debounce": "^4.0.8",
3839
"papaparse": "^5.4.1",

pnpm-lock.yaml

Lines changed: 7 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/app/activate-user/AwarenessStep.tsx renamed to src/app/activate-user/InfrastructureStep.tsx

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import AlertCircle from "@/assets/icons/alert-circle.svg?react";
2-
import { AwarenessForm } from "@/components/survey/AwarenessChannel";
3-
import { AwarenessFormType } from "@/components/survey/form-schemas";
2+
import { InfrastructureForm } from "@/components/survey/Infrastructure";
3+
import { InfrastructureFormType } from "@/components/survey/form-schemas";
44
import { useActivateUser } from "@/data/users/activate-user-mutation";
55
import { useToast } from "@zenml-io/react-component-library";
66
import { useActivationContext } from "./ActivationContext";
@@ -15,7 +15,7 @@ type Props = {
1515
setUsername: Dispatch<SetStateAction<string>>;
1616
};
1717

18-
export function AwarenessStep({ userId, setUsername }: Props) {
18+
export function InfraStep({ userId, setUsername }: Props) {
1919
const { newUser } = useActivationContext();
2020
const { setAuthState } = useAuthContext();
2121
const { setSurveyStep } = useSurveyContext();
@@ -44,14 +44,17 @@ export function AwarenessStep({ userId, setUsername }: Props) {
4444
}
4545
});
4646

47-
function handleAwarenessFormSubmit({ other, channels, otherVal }: AwarenessFormType) {
48-
const channelArr = other ? [...channels, otherVal] : channels;
49-
const updateMetadata: UserMetadata = { awareness_channels: channelArr as string[] };
47+
function handleInfraFormSubmit({ other, providers, otherVal }: InfrastructureFormType) {
48+
const providerArr = other ? [...providers, otherVal] : providers;
49+
const updateMetadata: UserMetadata = {
50+
infra_providers: providerArr as string[],
51+
finished_onboarding_survey: true
52+
};
5053
mutate({
5154
userId,
5255
body: { ...newUser, user_metadata: { ...newUser.user_metadata, ...updateMetadata } }
5356
});
5457
}
5558

56-
return <AwarenessForm submitHandler={handleAwarenessFormSubmit} />;
59+
return <InfrastructureForm submitHandler={handleInfraFormSubmit} />;
5760
}

src/app/activate-user/PrimaryUseStep.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,9 @@ export function PrimaryUseStep() {
88
const { setSurveyStep } = useSurveyContext();
99
const { setNewUser } = useActivationContext();
1010

11-
function handlePrimaryUseSubmit({ amountProductionModels, primaryUse }: PrimaryUseFormType) {
11+
function handlePrimaryUseSubmit({ primaryUse }: PrimaryUseFormType) {
1212
const newMetadata: UserMetadata = {
13-
primary_use: primaryUse,
14-
models_production: amountProductionModels
13+
primary_use: primaryUse
1514
};
1615
setNewUser((prev) => ({
1716
...prev,
Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { useSurveyContext } from "@/components/survey/SurveyContext";
2+
import { UsageReasonForm } from "@/components/survey/UsageReason";
3+
import { UsageReasonFormType } from "@/components/survey/form-schemas";
4+
import { UserMetadata } from "@/types/user";
5+
import { useActivationContext } from "./ActivationContext";
6+
7+
export function UsageReasonStep() {
8+
const { setSurveyStep } = useSurveyContext();
9+
const { setNewUser } = useActivationContext();
10+
11+
function handleUsageReasonSubmit({
12+
usageReason,
13+
comparison_tools,
14+
otherTool,
15+
otherToolVal
16+
}: UsageReasonFormType) {
17+
const metadata: UserMetadata = {
18+
usage_reason: usageReason,
19+
...(!!comparison_tools && {
20+
comparing_tools:
21+
!!otherTool && !!otherToolVal ? [...comparison_tools, otherToolVal] : comparison_tools
22+
})
23+
};
24+
setNewUser((prev) => ({
25+
...prev,
26+
user_metadata: { ...prev.user_metadata, ...metadata }
27+
}));
28+
setSurveyStep((prev) => prev + 1);
29+
}
30+
31+
return <UsageReasonForm submitHandler={handleUsageReasonSubmit} />;
32+
}

src/app/activate-user/Wizard.tsx

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,16 @@
1+
import { EmptyState } from "@/components/EmptyState";
2+
import { SlackStep } from "@/components/survey/SlackStep";
13
import StepDisplay from "@/components/survey/StepDisplay";
4+
import { SuccessStep } from "@/components/survey/SuccessStep";
25
import { useSurveyContext } from "@/components/survey/SurveyContext";
6+
import { useState } from "react";
7+
import { useSearchParams } from "react-router-dom";
38
import { AccountDetailsStep } from "./AccountDetailsStep";
9+
import { ActivationProvider } from "./ActivationContext";
10+
import { InfraStep } from "./InfrastructureStep";
411
import { SetPasswordStep } from "./PasswordStep";
512
import { PrimaryUseStep } from "./PrimaryUseStep";
6-
import { AwarenessStep } from "./AwarenessStep";
7-
import { ActivationProvider } from "./ActivationContext";
8-
import { useSearchParams } from "react-router-dom";
9-
import { EmptyState } from "@/components/EmptyState";
10-
import { SuccessStep } from "@/components/survey/SuccessStep";
11-
import { useState } from "react";
13+
import { UsageReasonStep } from "./UsageReasonStep";
1214

1315
export function ActivateWizard() {
1416
const { surveyStep } = useSurveyContext();
@@ -29,12 +31,14 @@ export function ActivateWizard() {
2931
return (
3032
<>
3133
<ActivationProvider initialUser={{ activation_token: token }}>
32-
<StepDisplay stepAmount={4} />
34+
<StepDisplay stepAmount={6} />
3335
{surveyStep === 1 && <AccountDetailsStep />}
3436
{surveyStep === 2 && <SetPasswordStep />}
3537
{surveyStep === 3 && <PrimaryUseStep />}
36-
{surveyStep === 4 && <AwarenessStep setUsername={setUsername} userId={id} />}
37-
{surveyStep === 5 && (
38+
{surveyStep === 4 && <UsageReasonStep />}
39+
{surveyStep === 5 && <InfraStep setUsername={setUsername} userId={id} />}
40+
{surveyStep === 6 && <SlackStep />}
41+
{surveyStep === 7 && (
3842
<SuccessStep subHeader="Your created your ZenML account" username={username} />
3943
)}
4044
</ActivationProvider>

src/app/runs/[id]/_Tabs/Overview/Info.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -26,13 +26,13 @@ export function InfoCollapsible() {
2626
const [open, setOpen] = useState(true);
2727
const { data, isError, isPending } = usePipelineRun({ runId });
2828

29-
const orchestrator_url: Metadata | undefined = (data?.metadata?.run_metadata as MetadataMap)
30-
?.orchestrator_url;
31-
const orchestrator_run_id = data?.metadata?.orchestrator_run_id;
32-
3329
if (isError) return null;
3430
if (isPending) return <Skeleton className="h-[200px]" />;
3531

32+
const orchestrator_url: Metadata | undefined = (data.metadata?.run_metadata as MetadataMap)
33+
?.orchestrator_url;
34+
const orchestrator_run_id = data.metadata?.orchestrator_run_id;
35+
3636
return (
3737
<CollapsiblePanel open={open} onOpenChange={setOpen}>
3838
<CollapsibleHeader className="flex items-center gap-[10px]">

src/app/survey/AwarenessStep.tsx renamed to src/app/survey/InfrastructureStep.tsx

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
import AlertCircle from "@/assets/icons/alert-circle.svg?react";
2-
import { AwarenessForm } from "@/components/survey/AwarenessChannel";
2+
import { InfrastructureForm } from "@/components/survey/Infrastructure";
33
import { useSurveyContext } from "@/components/survey/SurveyContext";
4-
import { AwarenessFormType } from "@/components/survey/form-schemas";
4+
import { InfrastructureFormType } from "@/components/survey/form-schemas";
55
import { getCurrentUserKey } from "@/data/users/current-user-query";
66
import { useUpdateCurrentUserMutation } from "@/data/users/update-current-user-mutation";
77
import { UserMetadata } from "@/types/user";
88
import { useQueryClient } from "@tanstack/react-query";
99
import { useToast } from "@zenml-io/react-component-library";
1010
import { useSurveyUserContext } from "./SurveyUserContext";
1111

12-
export function AwarenessStep() {
12+
export function InfrastructureStep() {
1313
const { user } = useSurveyUserContext();
1414
const { setSurveyStep } = useSurveyContext();
1515
const { toast } = useToast();
@@ -32,11 +32,14 @@ export function AwarenessStep() {
3232
}
3333
});
3434

35-
function handleAwarenessFormSubmit({ other, channels, otherVal }: AwarenessFormType) {
36-
const channelArr = other ? [...channels, otherVal] : channels;
37-
const updateMetadata: UserMetadata = { awareness_channels: channelArr as string[] };
35+
function handleInfrastructureSubmit({ other, providers, otherVal }: InfrastructureFormType) {
36+
const providerArr = other ? [...providers, otherVal] : providers;
37+
const updateMetadata: UserMetadata = {
38+
infra_providers: providerArr as string[],
39+
finished_onboarding_survey: true
40+
};
3841
mutate({ ...user, user_metadata: { ...user.user_metadata, ...updateMetadata } });
3942
}
4043

41-
return <AwarenessForm submitHandler={handleAwarenessFormSubmit} />;
44+
return <InfrastructureForm submitHandler={handleInfrastructureSubmit} />;
4245
}

src/app/survey/PrimaryUseStep.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,8 @@ export function PrimaryUseStep({ user }: Props) {
1212
const { setSurveyStep } = useSurveyContext();
1313
const { setUser } = useSurveyUserContext();
1414

15-
function handlePrimaryUseSubmit({ amountProductionModels, primaryUse }: PrimaryUseFormType) {
15+
function handlePrimaryUseSubmit({ primaryUse }: PrimaryUseFormType) {
1616
const metadata: UserMetadata = {
17-
models_production: amountProductionModels,
1817
primary_use: primaryUse
1918
};
2019
setUser((prev) => ({

src/app/survey/UsageReasonStep.tsx

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { useSurveyContext } from "@/components/survey/SurveyContext";
2+
import { UsageReasonForm } from "@/components/survey/UsageReason";
3+
import { UsageReasonFormType } from "@/components/survey/form-schemas";
4+
import { UserMetadata } from "@/types/user";
5+
import { useSurveyUserContext } from "./SurveyUserContext";
6+
7+
export function UsageReasonStep() {
8+
const { setSurveyStep } = useSurveyContext();
9+
const { setUser } = useSurveyUserContext();
10+
11+
function handleUsageReasonSubmit({
12+
usageReason,
13+
comparison_tools,
14+
otherTool,
15+
otherToolVal
16+
}: UsageReasonFormType) {
17+
const metadata: UserMetadata = {
18+
usage_reason: usageReason,
19+
...(!!comparison_tools && {
20+
comparing_tools:
21+
!!otherTool && !!otherToolVal ? [...comparison_tools, otherToolVal] : comparison_tools
22+
})
23+
};
24+
setUser((prev) => ({
25+
...prev,
26+
user_metadata: { ...prev.user_metadata, ...metadata }
27+
}));
28+
setSurveyStep((prev) => prev + 1);
29+
}
30+
31+
return <UsageReasonForm submitHandler={handleUsageReasonSubmit} />;
32+
}

0 commit comments

Comments
 (0)