Skip to content

Refactor: Refactored setting and profile #50

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
danieltate888 wants to merge 1 commit into
base: dev
Choose a base branch
from
Open

Refactor: Refactored setting and profile #50

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 3 additions & 16 deletions src/app/(protected)/account/profile/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,18 +1,5 @@
'use client';
import React from 'react';
import ProfilePage from '@/module/account/profile/ProfilePage';

import { Container, Row } from 'react-bootstrap';
import { useTitle } from '@/hooks/useTitle';
import ProfileMain from './_components/ProfileMain';

const Profile = () => {
useTitle('Profile - BeeQuant');

return (
<Container>
<Row>
<ProfileMain />
</Row>
</Container>
);
};
const Profile: React.FC = () => <ProfilePage />;
export default Profile;
160 changes: 3 additions & 157 deletions src/app/(protected)/account/settings/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,160 +1,6 @@
'use client';
import React from 'react';
import SettingPage from '@/module/account/setting/SettingPage';

import { Col, Container, Row } from 'react-bootstrap';
import PasswordField from '@/shared/components/form/Password';
import { Card, CardBody, CardTitleWrap, CardTitle, CardSubhead } from '@/shared/components/Card';
import {
FormButtonToolbar,
FormContainer,
FormGroup,
FormGroupField,
FormGroupLabel,
} from '@/shared/components/form/FormElements';
import { Button } from '@/shared/components/Button';
import FormField from '@/shared/components/form/FormHookField';
import { Controller, useForm } from 'react-hook-form';

const Setting = () => {
const {
handleSubmit,
control,
formState: { errors },
} = useForm();

const onSubmit = (data: any) => {
console.log('data:', data);
};

return (
<Container>
<Row>
<Col md={12} lg={12}>
<Card>
<CardBody>
<CardTitleWrap>
<CardTitle>Settings</CardTitle>
<CardSubhead>Update your profile</CardSubhead>
</CardTitleWrap>
<FormContainer $horizontal onSubmit={handleSubmit(onSubmit)}>
<FormGroup>
<FormGroupLabel>Real Name</FormGroupLabel>
<FormGroupField>
<FormField
name="realName"
control={control}
component="input"
errors={errors}
rules={{}}
defaultValue=""
placeholder="Real Name"
isAboveError
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Display Name</FormGroupLabel>
<FormGroupField>
<FormField
name="displayName"
control={control}
component="input"
errors={errors}
rules={{
required: 'This is required field',
}}
defaultValue=""
placeholder="Display Name"
isAboveError
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Email</FormGroupLabel>
<FormGroupField>
<FormField
name="email"
control={control}
component="input"
errors={errors}
rules={{}}
defaultValue="Your@mail.com"
placeholder="Email"
isAboveError
disabled
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Password</FormGroupLabel>
<FormGroupField>
<Controller
name="password"
control={control}
render={({ field, fieldState }) => (
<PasswordField
input={field}
meta={{
touched: !!fieldState.error,
error: fieldState.error?.message,
}}
placeholder="Password"
keyIcon
isAboveError
/>
)}
rules={{ required: 'This is required field' }}
defaultValue="initial password"
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Mobile</FormGroupLabel>
<FormGroupField>
<FormField
name="mobile"
control={control}
component="input"
errors={errors}
rules={{}}
defaultValue=""
placeholder="Mobile"
isAboveError
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Reference</FormGroupLabel>
<FormGroupField>
<FormField
name="ref"
control={control}
component="input"
errors={errors}
rules={{
required: 'This is required field',
}}
defaultValue="admin"
placeholder="Reference"
isAboveError
/>
</FormGroupField>
</FormGroup>
<FormButtonToolbar>
{/* @ts-ignore - Ignoring because of complex union types incorrectly inferred */}
<Button variant="primary" type="submit">
Submit
</Button>
<Button variant="secondary" type="button" onClick={() => {}}>
Cancel
</Button>
</FormButtonToolbar>
</FormContainer>
</CardBody>
</Card>
</Col>
</Row>
</Container>
);
};
const Setting: React.FC = () => <SettingPage />;

export default Setting;
0 ...le/_components/ProfileBasicComponents.tsx → ...ccount/profile/ProfileBasicComponents.tsx
View file
Open in desktop
File renamed without changes.
0 ...count/profile/_components/ProfileMain.tsx → src/module/account/profile/ProfileMain.tsx
View file
Open in desktop
File renamed without changes.
18 changes: 18 additions & 0 deletions src/module/account/profile/ProfilePage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
'use client';

import { Container, Row } from 'react-bootstrap';
import { useTitle } from '@/hooks/useTitle';
import ProfileMain from './ProfileMain';

const Profile = () => {
useTitle('Profile - BeeQuant');

return (
<Container>
<Row>
<ProfileMain />
</Row>
</Container>
);
};
export default Profile;
160 changes: 160 additions & 0 deletions src/module/account/setting/SettingPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,160 @@
'use client';

import { Col, Container, Row } from 'react-bootstrap';
import PasswordField from '@/shared/components/form/Password';
import { Card, CardBody, CardTitleWrap, CardTitle, CardSubhead } from '@/shared/components/Card';
import {
FormButtonToolbar,
FormContainer,
FormGroup,
FormGroupField,
FormGroupLabel,
} from '@/shared/components/form/FormElements';
import { Button } from '@/shared/components/Button';
import FormField from '@/shared/components/form/FormHookField';
import { Controller, useForm } from 'react-hook-form';

const SettingPage = () => {
const {
handleSubmit,
control,
formState: { errors },
} = useForm();

const onSubmit = (data: any) => {
console.log('data:', data);
};

return (
<Container>
<Row>
<Col md={12} lg={12}>
<Card>
<CardBody>
<CardTitleWrap>
<CardTitle>Settings</CardTitle>
<CardSubhead>Update your profile</CardSubhead>
</CardTitleWrap>
<FormContainer $horizontal onSubmit={handleSubmit(onSubmit)}>
<FormGroup>
<FormGroupLabel>Real Name</FormGroupLabel>
<FormGroupField>
<FormField
name="realName"
control={control}
component="input"
errors={errors}
rules={{}}
defaultValue=""
placeholder="Real Name"
isAboveError
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Display Name</FormGroupLabel>
<FormGroupField>
<FormField
name="displayName"
control={control}
component="input"
errors={errors}
rules={{
required: 'This is required field',
}}
defaultValue=""
placeholder="Display Name"
isAboveError
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Email</FormGroupLabel>
<FormGroupField>
<FormField
name="email"
control={control}
component="input"
errors={errors}
rules={{}}
defaultValue="Your@mail.com"
placeholder="Email"
isAboveError
disabled
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Password</FormGroupLabel>
<FormGroupField>
<Controller
name="password"
control={control}
render={({ field, fieldState }) => (
<PasswordField
input={field}
meta={{
touched: !!fieldState.error,
error: fieldState.error?.message,
}}
placeholder="Password"
keyIcon
isAboveError
/>
)}
rules={{ required: 'This is required field' }}
defaultValue="initial password"
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Mobile</FormGroupLabel>
<FormGroupField>
<FormField
name="mobile"
control={control}
component="input"
errors={errors}
rules={{}}
defaultValue=""
placeholder="Mobile"
isAboveError
/>
</FormGroupField>
</FormGroup>
<FormGroup>
<FormGroupLabel>Reference</FormGroupLabel>
<FormGroupField>
<FormField
name="ref"
control={control}
component="input"
errors={errors}
rules={{
required: 'This is required field',
}}
defaultValue="admin"
placeholder="Reference"
isAboveError
/>
</FormGroupField>
</FormGroup>
<FormButtonToolbar>
{/* @ts-ignore - Ignoring because of complex union types incorrectly inferred */}
<Button variant="primary" type="submit">
Submit
</Button>
<Button variant="secondary" type="button" onClick={() => {}}>
Cancel
</Button>
</FormButtonToolbar>
</FormContainer>
</CardBody>
</Card>
</Col>
</Row>
</Container>
);
};

export default SettingPage;
3 changes: 2 additions & 1 deletion src/routes/routeConfig.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import React from 'react';
import Page404 from 'app/not-found';
import Dashboard from 'app/(protected)/dashboard/page';
import ExchangeManagement from 'app/(protected)/exchange/page';
Expand All @@ -18,7 +19,7 @@ interface IRoute {
path: string;
name: string;
title: string;
component: () => JSX.Element;
component: React.ComponentType;
}

export const ROUTE_KEY = {
Expand Down
Loading