Skip to content

Commit 428595e

Browse files
brettkolodnybrettkolodny
authored
Merge pull request #18 from coder/brett/user-select
feat: mock workspace owners
2 parents 91128d1 + 70e5d36 commit 428595e

File tree

3 files changed

+108
-16
lines changed

3 files changed

+108
-16
lines changed

‎src/client/Preview.tsx

Lines changed: 51 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,12 @@ import {
1414
} from "@/client/diagnostics";
1515
import { useDebouncedValue } from "@/client/hooks/debounce";
1616
import { useStore } from "@/client/store";
17-
import type { ParameterWithSource, ParserLog, PreviewOutput} from "@/gen/types";
17+
import type {
18+
ParameterWithSource,
19+
ParserLog,
20+
PreviewOutput,
21+
WorkspaceOwner,
22+
} from "@/gen/types";
1823
import { cn } from "@/utils/cn";
1924
import ReactJsonView from "@microlink/react-json-view";
2025
import * as Dialog from "@radix-ui/react-dialog";
@@ -31,6 +36,14 @@ import {
3136
import { AnimatePresence, motion } from "motion/react";
3237
import { type FC, useCallback, useEffect, useMemo, useState } from "react";
3338
import { useSearchParams } from "react-router";
39+
import {
40+
Select,
41+
SelectContent,
42+
SelectItem,
43+
SelectTrigger,
44+
SelectValue,
45+
} from "@/client/components/Select";
46+
import { mockUsers } from "@/owner";
3447

3548
export const Preview: FC = () => {
3649
const $wasmState = useStore((state) => state.wasmState);
@@ -40,6 +53,7 @@ export const Preview: FC = () => {
4053
const $parameters = useStore((state) => state.parameters);
4154
const $setParameters = useStore((state) => state.setParameters);
4255
const $form = useStore((state) => state.form);
56+
const $owner = useStore((state) => state.owner);
4357
const $resetForm = useStore((state) => state.resetForm);
4458

4559
const [debouncedCode, isDebouncing] = useDebouncedValue($code, 1000);
@@ -83,16 +97,7 @@ export const Preview: FC = () => {
8397
{
8498
"main.tf": debouncedCode,
8599
},
86-
{
87-
id: "8d36e355-e775-4c49-9b8d-ac042ed50440",
88-
name: "coder",
89-
full_name: "Coder",
90-
email: "coder@coder.com",
91-
ssh_public_key: "",
92-
groups: ["Everyone"],
93-
login_type: "password",
94-
rbac_roles: [{name:"member", org_id:""}, {name:"organization-member",org_id:"09942665-ba1b-4661-be9f-36bf9f738c83"}]
95-
},
100+
$owner,
96101
$form,
97102
);
98103

@@ -133,7 +138,7 @@ export const Preview: FC = () => {
133138
};
134139

135140
getOutput();
136-
}, [debouncedCode, $setError, $wasmState, $setParameters, $form]);
141+
}, [debouncedCode, $setError, $wasmState, $setParameters, $form, $owner]);
137142

138143
return (
139144
<Tabs.Root
@@ -221,9 +226,16 @@ export const Preview: FC = () => {
221226
) : null}
222227
</AnimatePresence>
223228
</div>
224-
<Button variant="destructive" onClick={$resetForm}>
225-
Reset form
226-
</Button>
229+
<div className="flex w-full items-center justify-end gap-3">
230+
<UserSelect />
231+
<Button
232+
variant="destructive"
233+
onClick={$resetForm}
234+
className="w-fit"
235+
>
236+
Reset form
237+
</Button>
238+
</div>
227239
</div>
228240
}
229241
{$parameters.length === 0 ? (
@@ -617,3 +629,27 @@ const FormElement: FC<FormElementProps> = ({ parameter }) => {
617629
/>
618630
);
619631
};
632+
633+
const UserSelect: FC = () => {
634+
const $setWorkspaceOwner = useStore((state) => state.setWorkspaceOwner);
635+
636+
return (
637+
<Select
638+
defaultValue="admin"
639+
onValueChange={(value) => {
640+
const users: Record<string, WorkspaceOwner | undefined> = mockUsers;
641+
$setWorkspaceOwner(users[value] ?? mockUsers.admin);
642+
}}
643+
>
644+
<SelectTrigger className="w-fit min-w-40">
645+
<SelectValue />
646+
</SelectTrigger>
647+
<SelectContent>
648+
<SelectItem value="admin">Administrator</SelectItem>
649+
<SelectItem value="developer">Developer</SelectItem>
650+
<SelectItem value="contractor">Contractor</SelectItem>
651+
<SelectItem value="eu-developer">EU Developer</SelectItem>
652+
</SelectContent>
653+
</Select>
654+
);
655+
};

‎src/client/store.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import type { Diagnostic } from "@/client/diagnostics";
2-
import type { ParameterWithSource } from "@/gen/types";
2+
import type { ParameterWithSource, WorkspaceOwner } from "@/gen/types";
33
import type { editor } from "monaco-editor";
44
import { create } from "zustand";
55
import { defaultCode } from "./snippets";
6+
import { mockUsers } from "@/owner";
67

78
type FormState = Record<string, string>;
89

@@ -23,6 +24,7 @@ type State = {
2324
parameters: ParameterWithSource[];
2425
form: FormState;
2526
wasmState: WasmState;
27+
owner: WorkspaceOwner;
2628
errors: ErrorsState;
2729
setCode: (code: string) => void;
2830
setError: (diagnostics: Diagnostic[]) => void;
@@ -31,6 +33,7 @@ type State = {
3133
setParameters: (parameters: ParameterWithSource[]) => void;
3234
setFormState: (key: string, value: string) => void;
3335
setEditor: (editor: editor.IStandaloneCodeEditor) => void;
36+
setWorkspaceOwner: (owner: WorkspaceOwner) => void;
3437
resetForm: () => void;
3538
};
3639

@@ -39,6 +42,7 @@ export const useStore = create<State>()((set) => ({
3942
editor: null,
4043
parameters: [],
4144
wasmState: "loading",
45+
owner: mockUsers.admin,
4246
form: {},
4347
errors: defaultErrorsState,
4448
setCode: (code) => set((_) => ({ code })),
@@ -70,4 +74,5 @@ export const useStore = create<State>()((set) => ({
7074
}),
7175
resetForm: () => set(() => ({ form: {} })),
7276
setEditor: (editor) => set(() => ({ editor })),
77+
setWorkspaceOwner: (owner) => set(() => ({ owner })),
7378
}));

‎src/owner.ts

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import type { WorkspaceOwner } from "@/gen/types";
2+
3+
const BaseMockUser: WorkspaceOwner = {
4+
id: "8d36e355-e775-4c49-9b8d-ac042ed50440",
5+
name: "coder",
6+
full_name: "Coder",
7+
email: "coder@coder.com",
8+
ssh_public_key: "",
9+
groups: ["Everyone"],
10+
login_type: "password",
11+
rbac_roles: [
12+
{ name: "member", org_id: "" },
13+
{
14+
name: "organization-member",
15+
org_id: "09942665-ba1b-4661-be9f-36bf9f738c83",
16+
},
17+
],
18+
};
19+
20+
export type User = "admin" | "developer" | "contractor" | "eu-developer";
21+
22+
export const mockUsers: Record<User, WorkspaceOwner> = {
23+
admin: {
24+
...BaseMockUser,
25+
name: "admin",
26+
full_name: "Admin",
27+
email: "admin@coder.com",
28+
groups: ["admin"],
29+
},
30+
developer: {
31+
...BaseMockUser,
32+
name: "developer",
33+
full_name: "Developer",
34+
email: "dev@coder.com",
35+
groups: ["developer"],
36+
},
37+
contractor: {
38+
...BaseMockUser,
39+
name: "contractor",
40+
full_name: "Contractor",
41+
email: "contractor@coder.com",
42+
groups: ["contractor"],
43+
},
44+
"eu-developer": {
45+
...BaseMockUser,
46+
name: "eu-developer",
47+
full_name: "EU Developer",
48+
email: "eu.dev@coder.com",
49+
groups: ["developer", "eu-helsinki"],
50+
},
51+
};

0 commit comments

Comments
 (0)