Merge pull request #8 from sankaSanjeeva/develop

Develop

.github/workflows/main.yml

@@ -0,0 +1,25 @@
+name: Lint and TypeScript Checks
+
+on:
+  push:
+    branches:
+      - '**'
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: '20.x'
+
+      - name: Install dependencies
+        run: yarn install
+
+      - name: Run lint-staged for ESLint and TypeScript checks
+        run: npx lint-staged

CHANGELOG.md

@@ -1,4 +1,12 @@
-## 1.1.0 (June 22, 2022)
+## 1.2.0 (September 14, 2024)
+
+### New features
+
+- Add document
+- Add github actions
+- Add User module
+
+## 1.1.0 (August 03, 2024)
 
 ### New features
 
@@ -7,4 +15,4 @@
 
 ## 1.0.0 (July 14, 2024)
 
-* Initial public release
+- Initial public release

package.json

@@ -1,7 +1,7 @@
 {
   "name": "react-boilerplate",
   "private": true,
-  "version": "1.1.0",
+  "version": "1.2.0",
   "type": "module",
   "scripts": {
     "dev": "vite",

src/constants/index.ts

@@ -1,6 +1,2 @@
-// eslint-disable-next-line import/prefer-default-export
-export const PAGE_SIZE = 10;
-/**
- * Make sure PAGE_SIZE is inside the PAGE_SIZES
- */
 export const PAGE_SIZES = [5, 10, 20, 30, 40, 50];
+export const PAGE_SIZE = PAGE_SIZES[1];

src/modules/user/hooks/create-user.ts

@@ -6,8 +6,12 @@ const useCreateUser = () => {
   // const { api } = useAxios();
 
   const createUser = (data: CreateUser) => {
-    // randomuser.me API doesn't have any APIs to create user. So here a Promise.resolve(data) is returned for demo purpose
-    return Promise.resolve({ ...data, userId: '123456789' });
+    // randomuser.me API doesn't have any APIs to create user. So here a Promise is returned for demo purpose
+    return new Promise((resolve) => {
+      setTimeout(() => {
+        resolve({ ...data, userId: '123456789' });
+      }, 1000);
+    }) as Promise<CreateUser & { userId: string }>;
   };
 
   return useMutation({

src/modules/user/hooks/edit-user.ts

@@ -6,8 +6,12 @@ const useEditUser = () => {
   // const { api } = useAxios();
 
   const editUser = ({ userId, data }: { userId: string; data: CreateUser }) => {
-    // randomuser.me API doesn't have any APIs to create user. So here a Promise.resolve(data) is returned for demo purpose
-    return Promise.resolve({ ...data, userId });
+    // randomuser.me API doesn't have any APIs to create user. So here a Promise is returned for demo purpose
+    return new Promise((resolve) => {
+      setTimeout(() => {
+        resolve({ ...data, userId });
+      }, 1000);
+    }) as Promise<CreateUser & { userId: string }>;
   };
 
   return useMutation({

src/modules/user/pages/user-create-edit/index.tsx

@@ -22,8 +22,8 @@ export default function UserCreate() {
   const navigate = useNavigate();
 
   const { isLoading, refetch } = useGetUser(userId);
-  const { mutate: createUser } = useCreateUser();
-  const { mutate: editUser } = useEditUser();
+  const { isPending: isCreating, mutate: createUser } = useCreateUser();
+  const { isPending: isEditing, mutate: editUser } = useEditUser();
 
   const form = useForm<CreateUser>({
     resolver: zodResolver(createUserSchema),
@@ -78,7 +78,9 @@ export default function UserCreate() {
       >
         <div className="flex justify-between">
           <h1 className="text-2xl font-bold">{userId ? 'Edit' : 'New'} User</h1>
-          <Button className="gap-2">{userId ? 'Update' : 'Create'}</Button>
+          <Button className="gap-2" disabled={isCreating || isEditing}>
+            {userId ? 'Update' : 'Create'}
+          </Button>
         </div>
 
         <Card className="flex gap-5 p-6 !bg-transparent">