@opexa/portal-components 0.0.541 → 0.0.543

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,21 @@
1
- export interface AccountInfoProps {
1
+ interface BranchCode<T extends string = string> {
2
+ code: T;
3
+ name: string;
4
+ disabled?: boolean;
5
+ }
6
+ interface BaseAccountInfoProps {
2
7
  className?: string;
3
8
  googleSso?: boolean;
4
9
  facebookSso?: boolean;
5
- shouldShowBranchCode?: boolean;
6
10
  }
11
+ interface WithoutBranchCode extends BaseAccountInfoProps {
12
+ shouldShowBranchCode?: false;
13
+ branchCodes?: undefined;
14
+ }
15
+ interface WithBranchCode extends BaseAccountInfoProps {
16
+ shouldShowBranchCode: true;
17
+ branchCodes: BranchCode[];
18
+ }
19
+ export type AccountInfoProps = WithoutBranchCode | WithBranchCode;
7
20
  export declare function AccountInfo(props: AccountInfoProps): import("react/jsx-runtime").JSX.Element;
21
+ export {};
@@ -41,7 +41,7 @@ const accountSchema = z.object({
41
41
  .regex(/^[a-zA-Z0-9]+$/, 'Username can only contain letters and numbers'),
42
42
  });
43
43
  export function AccountInfo(props) {
44
- return (_jsxs("div", { className: twMerge('space-y-3xl', props.className), children: [_jsx(ProfileInfo, {}), _jsx(ContactInfo, {}), _jsx(PersonalInfo, { shouldShowBranchCode: props.shouldShowBranchCode }), _jsx(SSO, { google: props.googleSso, facebook: props.facebookSso })] }));
44
+ return (_jsxs("div", { className: twMerge('space-y-3xl', props.className), children: [_jsx(ProfileInfo, {}), _jsx(ContactInfo, {}), _jsx(PersonalInfo, { shouldShowBranchCode: props.shouldShowBranchCode, branchCodes: props.branchCodes }), _jsx(SSO, { google: props.googleSso, facebook: props.facebookSso })] }));
45
45
  }
46
46
  function ProfileInfo() {
47
47
  const [edit, setEdit] = useState(false);
@@ -84,7 +84,7 @@ function ProfileInfo() {
84
84
  form.reset();
85
85
  }, children: "Cancel" }), _jsx(Button, { type: "submit", size: "sm", fullWidth: false, disabled: !form.formState.isValid || isPending, children: "Save Changes" })] })] })) : (_jsxs("div", { className: "mt-2", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("h3", { className: "font-semibold text-lg text-text-secondary-700 leading-tight", children: account?.name }), _jsx("button", { type: "button", onClick: () => setEdit(true), children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", fill: "none", viewBox: "0 0 24 24", stroke: "#cecfd2", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M11 4H6.8c-1.68 0-2.52 0-3.162.327a3 3 0 0 0-1.311 1.311C2 6.28 2 7.12 2 8.8v8.4c0 1.68 0 2.52.327 3.162a3 3 0 0 0 1.311 1.311C4.28 22 5.12 22 6.8 22h8.4c1.68 0 2.52 0 3.162-.327a3 3 0 0 0 1.311-1.311C20 19.72 20 18.88 20 17.2V13M8 16h1.675c.489 0 .733 0 .963-.055.204-.05.4-.13.579-.24.201-.123.374-.296.72-.642L21.5 5.5a2.121 2.121 0 0 0-3-3l-9.563 9.563c-.346.346-.519.519-.642.72a2 2 0 0 0-.24.579c-.055.23-.055.474-.055.963z" }) }) })] }), _jsx("p", { className: "text-text-tertiary-600 leading-tight", children: account?.id })] }))] }) }) })] }));
86
86
  }
87
- function PersonalInfo({ shouldShowBranchCode, }) {
87
+ function PersonalInfo(props) {
88
88
  const accountQuery = useAccountQuery();
89
89
  const account = accountQuery.data;
90
90
  const updateAccountMutation = useUpdateAccountMutation({
@@ -136,6 +136,8 @@ function PersonalInfo({ shouldShowBranchCode, }) {
136
136
  });
137
137
  }
138
138
  }, [account, form]);
139
+ const branchName = props.branchCodes?.find((branch) => branch.code === account?.branchCode);
140
+ const displayBranchName = `${branchName?.code} - ${branchName?.name}`;
139
141
  return (_jsxs("div", { children: [_jsx("h2", { className: "font-semibold text-sm text-text-secondary-700", children: "Personal Data" }), _jsxs("form", { className: "mt-5 rounded-xl border border-border-secondary bg-bg-primary-alt shadow-xs", onSubmit: form.handleSubmit((data) => {
140
142
  updateAccountMutation.mutate({
141
143
  realName: data.realName && account?.realName !== data.realName
@@ -145,7 +147,7 @@ function PersonalInfo({ shouldShowBranchCode, }) {
145
147
  ? data.birthDay
146
148
  : undefined,
147
149
  });
148
- }), children: [_jsxs("div", { className: "px-4 py-5 lg:px-3xl lg:py-5", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.realName, readOnly: !!account?.realName, children: [_jsx(Field.Label, { children: "Full name" }), _jsx(Field.Input, { ...form.register('realName') }), _jsx(Field.ErrorText, { children: form.formState.errors.realName?.message })] }), _jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.birthDay, readOnly: !!account?.birthDay, children: [_jsx(Field.Label, { children: "Date of birth" }), _jsx(Field.Input, { type: "date", ...form.register('birthDay') }), _jsx(Field.ErrorText, { children: form.formState.errors.birthDay?.message })] }), shouldShowBranchCode && (_jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.birthDay, readOnly: !!account?.birthDay, children: [_jsx(Field.Label, { children: "Branch Code" }), _jsx(Field.Input, { type: "text", disabled: true, value: account?.branchCode ?? '' })] }))] }), form.formState.isDirty && (_jsxs("div", { className: "flex justify-end gap-lg border-border-secondary border-t px-xl py-lg lg:px-3xl lg:py-xl", children: [_jsx(Button, { size: "sm", variant: "outline", fullWidth: false, disabled: updateAccountMutation.isPending, onClick: () => form.reset(), children: "Cancel" }), _jsx(Button, { type: "submit", size: "sm", fullWidth: false, disabled: !form.formState.isValid || updateAccountMutation.isPending, children: "Save Changes" })] }))] })] }));
150
+ }), children: [_jsxs("div", { className: "px-4 py-5 lg:px-3xl lg:py-5", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.realName, readOnly: !!account?.realName, children: [_jsx(Field.Label, { children: "Full name" }), _jsx(Field.Input, { ...form.register('realName') }), _jsx(Field.ErrorText, { children: form.formState.errors.realName?.message })] }), _jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.birthDay, readOnly: !!account?.birthDay, children: [_jsx(Field.Label, { children: "Date of birth" }), _jsx(Field.Input, { type: "date", ...form.register('birthDay') }), _jsx(Field.ErrorText, { children: form.formState.errors.birthDay?.message })] }), props.shouldShowBranchCode && (_jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.birthDay, readOnly: !!account?.birthDay, children: [_jsx(Field.Label, { children: "Branch Code" }), _jsx(Field.Input, { type: "text", disabled: true, value: displayBranchName ?? account?.branchCode ?? '' })] }))] }), form.formState.isDirty && (_jsxs("div", { className: "flex justify-end gap-lg border-border-secondary border-t px-xl py-lg lg:px-3xl lg:py-xl", children: [_jsx(Button, { size: "sm", variant: "outline", fullWidth: false, disabled: updateAccountMutation.isPending, onClick: () => form.reset(), children: "Cancel" }), _jsx(Button, { type: "submit", size: "sm", fullWidth: false, disabled: !form.formState.isValid || updateAccountMutation.isPending, children: "Save Changes" })] }))] })] }));
149
151
  }
150
152
  function ContactInfo() {
151
153
  const localeInfo = useLocaleInfo();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opexa/portal-components",
3
- "version": "0.0.541",
3
+ "version": "0.0.543",
4
4
  "exports": {
5
5
  "./ui/*": {
6
6
  "types": "./dist/ui/*/index.d.ts",