diff --git a/apps/console/src/pages/CreatePeoplePage.tsx b/apps/console/src/pages/CreatePeoplePage.tsx index d2cc8908b..d7aa49d3f 100644 --- a/apps/console/src/pages/CreatePeoplePage.tsx +++ b/apps/console/src/pages/CreatePeoplePage.tsx @@ -22,6 +22,9 @@ import { SelectValue, } from "@/components/ui/select"; import type { CreatePeoplePageQuery as CreatePeoplePageQueryType } from "./__generated__/CreatePeoplePageQuery.graphql"; +import { useToast } from "@/hooks/use-toast"; +import { HelpCircle } from "lucide-react"; +import { cn } from "@/lib/utils"; const createPeoplePageQuery = graphql` query CreatePeoplePageQuery { @@ -40,11 +43,46 @@ const createPeopleMutation = graphql` id fullName primaryEmailAddress + additionalEmailAddresses kind } } `; +function EditableField({ + label, + value, + onChange, + type = "text", + helpText, + required, +}: { + label: string; + value: string; + onChange: (value: string) => void; + type?: string; + helpText?: string; + required?: boolean; +}) { + return ( +
+
+ + +
+
+ onChange(e.target.value)} + required={required} + /> + {helpText &&

{helpText}

} +
+
+ ); +} + function CreatePeoplePageContent({ queryRef, }: { @@ -53,115 +91,187 @@ function CreatePeoplePageContent({ const navigate = useNavigate(); const environment = useRelayEnvironment(); const data = usePreloadedQuery(createPeoplePageQuery, queryRef); - const [createPeople, isCreatingPeople] = useMutation(createPeopleMutation); - const [kind, setKind] = useState<"EMPLOYEE" | "CONTRACTOR" | "VENDOR">( - "EMPLOYEE", - ); + const [commit] = useMutation(createPeopleMutation); + const { toast } = useToast(); + const [formData, setFormData] = useState({ + fullName: '', + primaryEmailAddress: '', + additionalEmailAddresses: [] as string[], + kind: 'EMPLOYEE' as 'EMPLOYEE' | 'CONTRACTOR', + }); - const handleSubmit = (e: React.FormEvent) => { + const handleFieldChange = (field: keyof typeof formData, value: any) => { + setFormData(prev => ({ + ...prev, + [field]: value, + })); + }; + + const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); - const formData = new FormData(e.currentTarget); - - createPeople({ + commit({ variables: { input: { organizationId: data.node.id, - fullName: formData.get("fullName") as string, - primaryEmailAddress: formData.get("primaryEmailAddress") as string, - kind, + fullName: formData.fullName, + primaryEmailAddress: formData.primaryEmailAddress, + additionalEmailAddresses: formData.additionalEmailAddresses, + kind: formData.kind, }, }, - onCompleted() { - // Invalidate the peoples list query + onCompleted: (response) => { environment.commitUpdate((store) => { const organization = store.get(data.node.id); if (organization) { organization.invalidateRecord(); } + }) + toast({ + title: "Success", + description: "Person created successfully", + variant: "default", + }); + navigate(`/peoples/${(response as any).createPeople.id}`); + }, + onError: (error) => { + toast({ + title: "Error", + description: error.message || "Failed to create person", + variant: "destructive", }); - - navigate("/peoples"); }, }); }; return ( -
+ <> - Create People - Probo Console + Create Person - Probo Console -
-
-

- Create People -

-

- Add a new person to your organization. -

-
+
+
+
+ handleFieldChange('fullName', value)} + required + /> - - - People Information - - - -
- - + handleFieldChange('primaryEmailAddress', value)} + required + /> + +
+
+ +
-
- - -
- -
- - -
- -
+ {formData.additionalEmailAddresses.map((email, index) => ( +
+ { + const newEmails = [...formData.additionalEmailAddresses]; + newEmails[index] = e.target.value; + handleFieldChange('additionalEmailAddresses', newEmails); + }} + /> + +
+ ))} -
- - - -
-
+
+ + +
+
+

Additional Information

+

+ Additional details about the person +

+
+ +
+
+
+ + +
+
+ + +
+
+
+
+
+
+
+
+ + +
+ + ); } diff --git a/apps/console/src/pages/__generated__/CreatePeoplePageCreatePeopleMutation.graphql.ts b/apps/console/src/pages/__generated__/CreatePeoplePageCreatePeopleMutation.graphql.ts index 6bd608f2f..f4ff669fb 100644 --- a/apps/console/src/pages/__generated__/CreatePeoplePageCreatePeopleMutation.graphql.ts +++ b/apps/console/src/pages/__generated__/CreatePeoplePageCreatePeopleMutation.graphql.ts @@ -1,5 +1,5 @@ /** - * @generated SignedSource<<26992373ce2e1751c6d070a6bbf6c8db>> + * @generated SignedSource<> * @lightSyntaxTransform * @nogrep */ @@ -11,6 +11,7 @@ import { ConcreteRequest } from 'relay-runtime'; export type PeopleKind = "CONTRACTOR" | "EMPLOYEE"; export type CreatePeopleInput = { + additionalEmailAddresses?: ReadonlyArray | null | undefined; fullName: string; kind: PeopleKind; organizationId: string; @@ -21,6 +22,7 @@ export type CreatePeoplePageCreatePeopleMutation$variables = { }; export type CreatePeoplePageCreatePeopleMutation$data = { readonly createPeople: { + readonly additionalEmailAddresses: ReadonlyArray; readonly fullName: string; readonly id: string; readonly kind: PeopleKind; @@ -76,6 +78,13 @@ v1 = [ "name": "primaryEmailAddress", "storageKey": null }, + { + "alias": null, + "args": null, + "kind": "ScalarField", + "name": "additionalEmailAddresses", + "storageKey": null + }, { "alias": null, "args": null, @@ -105,16 +114,16 @@ return { "selections": (v1/*: any*/) }, "params": { - "cacheID": "6438f79d9a2e3d3e5cfcc98c4107e512", + "cacheID": "6674304ecdd07af45a837b942faed8f3", "id": null, "metadata": {}, "name": "CreatePeoplePageCreatePeopleMutation", "operationKind": "mutation", - "text": "mutation CreatePeoplePageCreatePeopleMutation(\n $input: CreatePeopleInput!\n) {\n createPeople(input: $input) {\n id\n fullName\n primaryEmailAddress\n kind\n }\n}\n" + "text": "mutation CreatePeoplePageCreatePeopleMutation(\n $input: CreatePeopleInput!\n) {\n createPeople(input: $input) {\n id\n fullName\n primaryEmailAddress\n additionalEmailAddresses\n kind\n }\n}\n" } }; })(); -(node as any).hash = "55f9379fac4d33ca3b2c21acf80094de"; +(node as any).hash = "c2962b44f158d7899d7e5b4d071e9238"; export default node; diff --git a/pkg/api/console/v1/schema.graphql b/pkg/api/console/v1/schema.graphql index 99ca27a9d..862780101 100644 --- a/pkg/api/console/v1/schema.graphql +++ b/pkg/api/console/v1/schema.graphql @@ -340,6 +340,7 @@ input CreatePeopleInput { organizationId: ID! fullName: String! primaryEmailAddress: String! + additionalEmailAddresses: [String!] kind: PeopleKind! } diff --git a/pkg/api/console/v1/schema/schema.go b/pkg/api/console/v1/schema/schema.go index f508c3820..6cf990e2c 100644 --- a/pkg/api/console/v1/schema/schema.go +++ b/pkg/api/console/v1/schema/schema.go @@ -1732,6 +1732,7 @@ input CreatePeopleInput { organizationId: ID! fullName: String! primaryEmailAddress: String! + additionalEmailAddresses: [String!] kind: PeopleKind! } @@ -9619,7 +9620,7 @@ func (ec *executionContext) unmarshalInputCreatePeopleInput(ctx context.Context, asMap[k] = v } - fieldsInOrder := [...]string{"organizationId", "fullName", "primaryEmailAddress", "kind"} + fieldsInOrder := [...]string{"organizationId", "fullName", "primaryEmailAddress", "additionalEmailAddresses", "kind"} for _, k := range fieldsInOrder { v, ok := asMap[k] if !ok { @@ -9647,6 +9648,13 @@ func (ec *executionContext) unmarshalInputCreatePeopleInput(ctx context.Context, return it, err } it.PrimaryEmailAddress = data + case "additionalEmailAddresses": + ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("additionalEmailAddresses")) + data, err := ec.unmarshalOString2ᚕstringᚄ(ctx, v) + if err != nil { + return it, err + } + it.AdditionalEmailAddresses = data case "kind": ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("kind")) data, err := ec.unmarshalNPeopleKind2githubᚗcomᚋgetproboᚋproboᚋpkgᚋproboᚋcoredataᚐPeopleKind(ctx, v) diff --git a/pkg/api/console/v1/types/types.go b/pkg/api/console/v1/types/types.go index e4455d848..4215d37c6 100644 --- a/pkg/api/console/v1/types/types.go +++ b/pkg/api/console/v1/types/types.go @@ -60,10 +60,11 @@ type ControlStateTransitionEdge struct { } type CreatePeopleInput struct { - OrganizationID gid.GID `json:"organizationId"` - FullName string `json:"fullName"` - PrimaryEmailAddress string `json:"primaryEmailAddress"` - Kind coredata.PeopleKind `json:"kind"` + OrganizationID gid.GID `json:"organizationId"` + FullName string `json:"fullName"` + PrimaryEmailAddress string `json:"primaryEmailAddress"` + AdditionalEmailAddresses []string `json:"additionalEmailAddresses,omitempty"` + Kind coredata.PeopleKind `json:"kind"` } type CreateVendorInput struct {