-
Notifications
You must be signed in to change notification settings - Fork 12
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Remove NextJs default styles We will be using JoyUI theme for now so its safe to delete this * Add ReactQuery to project This lib is being installed to facilitate the communication with the API and the state management for it. * Create hooks to fetch projects and tasktypes * Create Form page * Add reset form action * Switch Select for Autocomplete * Refactor useForm types * Add loading to select * Improve Buttons positioning * Fix Autocomplete clear * Select Option on autocomplete with Tab * Adjust Task to TaskType * Reorder TaskForm fields
- Loading branch information
1 parent
125cb06
commit 5017b6b
Showing
15 changed files
with
542 additions
and
108 deletions.
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,18 @@ | ||
| 'use client' | ||
|
|
||
| import { CssVarsProvider } from '@mui/joy/styles' | ||
| import { QueryClient, QueryClientProvider } from '@tanstack/react-query' | ||
| import { AuthProvider } from '@/app/auth/AuthProvider' | ||
| import { theme } from '@/ui/theme' | ||
|
|
||
| const queryClient = new QueryClient() | ||
|
|
||
| export const Providers = ({ children }: { children: React.ReactNode }) => { | ||
| return ( | ||
| <AuthProvider> | ||
| <QueryClientProvider client={queryClient}> | ||
| <CssVarsProvider theme={theme}>{children}</CssVarsProvider> | ||
| </QueryClientProvider> | ||
| </AuthProvider> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,17 @@ | ||
| import { useState } from 'react' | ||
|
|
||
| type UseFormProps<T> = { | ||
| initialValues: T | ||
| } | ||
|
|
||
| export const useForm = <T>({ initialValues }: UseFormProps<T>) => { | ||
| const [formState, setFormState] = useState(initialValues) | ||
|
|
||
| const handleChange = <F extends keyof T>(field: F, newValue: T[F]) => { | ||
| setFormState((prevFormState) => ({ ...prevFormState, [field]: newValue })) | ||
| } | ||
|
|
||
| const resetForm = () => setFormState(initialValues) | ||
|
|
||
| return { handleChange, formState, resetForm } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,39 @@ | ||
| import { useQuery } from '@tanstack/react-query' | ||
| import { useAuth } from 'react-oidc-context' | ||
|
|
||
| import { apiClient } from '@/infra/apiClient' | ||
|
|
||
| type Project = { | ||
| id: string | ||
| area_id: number | ||
| customer_id: number | ||
| description: string | ||
| is_active: boolean | ||
| init?: string | ||
| end?: string | ||
| invoice?: number | ||
| estimated_hours?: number | ||
| moved_hours?: number | ||
| project_type?: string | ||
| schedule_type?: string | ||
| } | ||
|
|
||
| const fetchProjects = (token: string): Promise<Array<Project>> => { | ||
| return apiClient(token) | ||
| .get('/v1/projects') | ||
| .then((response) => response.data) | ||
| } | ||
|
|
||
| export const useProjects = () => { | ||
| const auth = useAuth() | ||
| const token = auth.user?.access_token || '' | ||
|
|
||
| const { data = [], isLoading } = useQuery({ | ||
| queryKey: ['projects', token], | ||
| queryFn: () => { | ||
| return fetchProjects(token) | ||
| } | ||
| }) | ||
|
|
||
| return { projects: data, isLoading } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| import { useQuery } from '@tanstack/react-query' | ||
| import { useAuth } from 'react-oidc-context' | ||
|
|
||
| type TaskType = { | ||
| slug: string | ||
| name: string | ||
| active: boolean | ||
| } | ||
|
|
||
| // Temporary disable so we don't need to change the fetch api for now. | ||
| // eslint-disable-next-line @typescript-eslint/no-unused-vars | ||
| const fetchTaskTypes = (token: string): Promise<Array<TaskType>> => { | ||
| // return apiClient(token) | ||
| // .get('/v1/timelog/task_types/') | ||
| // .then((response) => response.data) | ||
| const mockData = Promise.resolve([ | ||
| { name: 'mock task type', slug: 'mock-test', active: true }, | ||
| { name: 'mock task type 2', slug: 'mock-test-2', active: true } | ||
| ]) | ||
| return mockData | ||
| } | ||
|
|
||
| export const useTaskTypes = () => { | ||
| const auth = useAuth() | ||
| const token = auth.user?.access_token || '' | ||
|
|
||
| const { data } = useQuery({ | ||
| queryKey: ['taskTypes', token], | ||
| queryFn: () => { | ||
| return fetchTaskTypes(token) | ||
| }, | ||
| initialData: [] | ||
| }) | ||
|
|
||
| return data | ||
| } |
Oops, something went wrong.