use kebab case for all files

docs/api-layer.md

@@ -10,4 +10,4 @@ No matter if your application is consuming RESTful or GraphQL API, have a single
 
 Instead of declaring API requests on the go, have them defined and exported separately. If it's a RESTful API a declaration would be a fetcher function that calls an endpoint. On the other hand, requests for GraphQL APIs are declared via queries and mutations that could be consumed by data fetching libraries such as [react-query](https://react-query.tanstack.com/), [apollo-client](https://www.apollographql.com/docs/react/), [urql](https://formidable.com/open-source/urql/), etc. This makes it easier to track which endpoints are defined and available in the application. You can also type the responses and infer them further for a good type safety of the data. You can also define and export corresponding API hooks from there.
 
-[API Request Declaration Example Code](../src/features/discussions/api/getDiscussions.ts)
+[API Request Declaration Example Code](../src/features/discussions/api/get-discussions.ts)

docs/security.md

@@ -45,12 +45,12 @@ Authorization is a process of determining if the user is allowed to access a res
 
 The most common method. Define allowed roles for a resource and then check if a user has the allowed role in order to access a resource. Good example is `USER` and `ADMIN` roles. You want to restrict some things for users and let admins access it.
 
-[RBAC Example Code](../src/features/discussions/components/CreateDiscussion.tsx)
+[RBAC Example Code](../src/features/discussions/components/create-discussion.tsx)
 
 #### PBAC (Permission based access control)
 
 Sometimes RBAC is not enough. Some of the operations should be allowed only by the owner of the resource. For example user's comment - only the author of the comment should be able to delete it. That's why you might want to use PBAC, as it is more flexible.
 
 For RBAC protection you can use the `RBAC` component by passing allowed roles to it. On the other hand if you need more strict protection, you can pass policies check to it.
 
-[PBAC Example Code](../src/features/comments/components/CommentsList.tsx)
+[PBAC Example Code](../src/features/comments/components/comments-list.tsx)

docs/state-management.md

@@ -9,7 +9,7 @@ This is the state that only a component needs, and it is not meant to be shared
 - [useState](https://react.dev/reference/react/useState) - for simpler states that are independent
 - [useReducer](https://react.dev/reference/react/useReducer) - for more complex states where on a single action you want to update several pieces of state
 
-[Component State Example Code](../src/features/auth/components/RegisterForm.tsx)
+[Component State Example Code](../src/features/auth/components/register-form.tsx)
 
 ## Application State
 
@@ -39,7 +39,7 @@ Good Server Cache Libraries:
 - [apollo client](https://www.apollographql.com/) - GraphQL
 - [urql](https://formidable.com/open-source/urql/) - GraphQl
 
-[Server State Example Code](../src/features/discussions/api/getDiscussions.ts)
+[Server State Example Code](../src/features/discussions/api/get-discussions.ts)
 
 ## Form State
 
@@ -66,10 +66,10 @@ You can also integrate validation libraries with the mentioned solutions to vali
 - [zod](https://github.com/colinhacks/zod)
 - [yup](https://github.com/jquense/yup)
 
-[Validation Example Code](../src/features/auth/components/RegisterForm.tsx)
+[Validation Example Code](../src/features/auth/components/register-form.tsx)
 
 ## URL State
 
 State that is being kept in the address bar of the browser. It is usually tracked via url params (`/app/${dynamicParam}`) or query params (`/app?dynamicParam=1`). It can be accessed and controlled via your routing solution such as `react-router-dom`.
 
-[URL State Example Code](../src/features/discussions/routes/Discussion.tsx)
+[URL State Example Code](../src/features/discussions/routes/discussion.tsx)

docs/testing.md

@@ -16,7 +16,7 @@ You should write unit tests for shared components and functions that are used th
 Integration testing is a type of testing multiple parts of application together.
 Most of your tests should be integration tests, as these will give you the most benefits and confidence for your invested effort. Unit tests on their own don't guarantee that your app will work even if those tests pass, because the relationship between different parts might be wrong. You should test different features with integration tests.
 
-[Integration Test Example Code](../src/features/discussions/routes/__tests__/Discussion.test.tsx)
+[Integration Test Example Code](../src/features/discussions/routes/__tests__/discussion.test.tsx)
 
 ### E2E
 

package.json

@@ -9,7 +9,7 @@
     "preview": "vite preview",
     "test": "vitest",
     "prepare": "husky",
-    "lint": "eslint src --fix --ignore-path .gitignore",
+    "lint": "eslint src --ignore-path .gitignore",
     "check-types": "tsc --project tsconfig.json --pretty --noEmit",
     "generate": "plop",
     "storybook": "storybook dev -p 6006",

src/components/ui/dialog/__tests__/dialog.test.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 import { Button } from '@/components/ui/button';
-import { useDisclosure } from '@/hooks/useDisclosure';
+import { useDisclosure } from '@/hooks/use-disclosure';
 import { rtlRender, screen, userEvent, waitFor } from '@/test/test-utils';
 
 import {

src/components/ui/dialog/confirmation-dialog/confirmation-dialog.tsx

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { useEffect } from 'react';
 
 import { Button } from '@/components/ui/button';
-import { useDisclosure } from '@/hooks/useDisclosure';
+import { useDisclosure } from '@/hooks/use-disclosure';
 
 import {
   Dialog,

src/components/ui/dialog/dialog.stories.tsx

@@ -2,7 +2,7 @@ import { Meta, StoryObj } from '@storybook/react';
 import * as React from 'react';
 
 import { Button } from '@/components/ui/button';
-import { useDisclosure } from '@/hooks/useDisclosure';
+import { useDisclosure } from '@/hooks/use-disclosure';
 
 import {
   Dialog,

src/components/ui/drawer/drawer.stories.tsx

@@ -1,7 +1,7 @@
 import { Meta, StoryObj } from '@storybook/react';
 
 import { Button } from '@/components/ui/button';
-import { useDisclosure } from '@/hooks/useDisclosure';
+import { useDisclosure } from '@/hooks/use-disclosure';
 
 import {
   Drawer,

src/components/ui/form/form-drawer.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { useDisclosure } from '@/hooks/useDisclosure';
+import { useDisclosure } from '@/hooks/use-disclosure';
 
 import { Button } from '../button';
 import {

src/features/auth/components/__tests__/LoginForm.test.tsx → src/features/auth/components/__tests__/login-form.test.tsx

@@ -1,6 +1,6 @@
 import { createUser, renderApp, screen, userEvent, waitFor } from '@/test/test-utils';
 
-import { LoginForm } from '../LoginForm';
+import { LoginForm } from '../login-form';
 
 test('should login new user and call onSuccess cb which should navigate the user to the app', async () => {
   const newUser = await createUser({ teamId: undefined });

src/features/auth/components/__tests__/RegisterForm.test.tsx → src/features/auth/components/__tests__/register-form.test.tsx

@@ -1,7 +1,7 @@
 import { userGenerator } from '@/test/data-generators';
 import { renderApp, screen, userEvent, waitFor } from '@/test/test-utils';
 
-import { RegisterForm } from '../RegisterForm';
+import { RegisterForm } from '../register-form';
 
 test('should register new user and call onSuccess cb which should navigate the user to the app', async () => {
   const newUser = userGenerator({});

src/features/auth/index.ts

@@ -2,7 +2,7 @@ export * from './lib/auth';
 export * from './lib/authorization';
 export * from './lib/protected-route';
 
-export * from './routes/Register';
-export * from './routes/Login';
+export * from './routes/register';
+export * from './routes/login';
 
 export * from './types';

src/features/auth/lib/auth.tsx

@@ -1,6 +1,6 @@
 import { configureAuth } from 'react-query-auth';
 
-import { getUser } from '../api/getUser';
+import { getUser } from '../api/get-user';
 import { LoginCredentialsDTO, loginWithEmailAndPassword } from '../api/login';
 import { logout } from '../api/logout';
 import { RegisterCredentialsDTO, registerWithEmailAndPassword } from '../api/register';

src/features/auth/routes/Login.tsx → src/features/auth/routes/login.tsx

@@ -1,7 +1,7 @@
 import { useNavigate, useSearchParams } from 'react-router-dom';
 
-import { Layout } from '../components/Layout';
-import { LoginForm } from '../components/LoginForm';
+import { Layout } from '../components/auth-layout';
+import { LoginForm } from '../components/login-form';
 
 export const LoginRoute = () => {
   const navigate = useNavigate();

src/features/auth/routes/Register.tsx → src/features/auth/routes/register.tsx

@@ -1,7 +1,7 @@
 import { useNavigate, useSearchParams } from 'react-router-dom';
 
-import { Layout } from '../components/Layout';
-import { RegisterForm } from '../components/RegisterForm';
+import { Layout } from '../components/auth-layout';
+import { RegisterForm } from '../components/register-form';
 
 export const RegisterRoute = () => {
   const navigate = useNavigate();

src/features/comments/components/CommentsList.tsx → src/features/comments/components/comments-list.tsx

@@ -6,9 +6,9 @@ import { useUser, POLICIES, Authorization } from '@/features/auth';
 import { User } from '@/features/users';
 import { formatDate } from '@/utils/format';
 
-import { useComments } from '../api/getComments';
+import { useComments } from '../api/get-comments';
 
-import { DeleteComment } from './DeleteComment';
+import { DeleteComment } from './delete-comment';
 
 type CommentsListProps = {
   discussionId: string;

src/features/comments/components/Comments.tsx → src/features/comments/components/comments.tsx

@@ -1,5 +1,5 @@
-import { CommentsList } from './CommentsList';
-import { CreateComment } from './CreateComment';
+import { CommentsList } from './comments-list';
+import { CreateComment } from './create-comment';
 
 type CommentsProps = {
   discussionId: string;

src/features/comments/components/CreateComment.tsx → src/features/comments/components/create-comment.tsx

@@ -4,7 +4,7 @@ import * as z from 'zod';
 import { Button } from '@/components/ui/button';
 import { Form, FormDrawer, Textarea } from '@/components/ui/form';
 
-import { CreateCommentDTO, useCreateComment } from '../api/createComment';
+import { CreateCommentDTO, useCreateComment } from '../api/create-comment';
 
 const schema = z.object({
   body: z.string().min(1, 'Required'),

src/features/comments/components/DeleteComment.tsx → src/features/comments/components/delete-comment.tsx

@@ -3,7 +3,7 @@ import { Trash } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { ConfirmationDialog } from '@/components/ui/dialog';
 
-import { useDeleteComment } from '../api/deleteComment';
+import { useDeleteComment } from '../api/delete-comment';
 
 type DeleteCommentProps = {
   id: string;

src/features/comments/index.ts

@@ -1,2 +1,2 @@
 export * from './types';
-export * from './components/Comments';
+export * from './components/comments';

src/features/discussions/components/CreateDiscussion.tsx → src/features/discussions/components/create-discussion.tsx

@@ -5,7 +5,7 @@ import { Button } from '@/components/ui/button';
 import { Form, FormDrawer, Input, Textarea } from '@/components/ui/form';
 import { Authorization, ROLES } from '@/features/auth';
 
-import { CreateDiscussionDTO, useCreateDiscussion } from '../api/createDiscussion';
+import { CreateDiscussionDTO, useCreateDiscussion } from '../api/create-discussion';
 
 const schema = z.object({
   title: z.string().min(1, 'Required'),

src/features/discussions/components/DeleteDiscussion.tsx → src/features/discussions/components/delete-discussion.tsx

@@ -4,7 +4,7 @@ import { Button } from '@/components/ui/button';
 import { ConfirmationDialog } from '@/components/ui/dialog';
 import { Authorization, ROLES } from '@/features/auth';
 
-import { useDeleteDiscussion } from '../api/deleteDiscussion';
+import { useDeleteDiscussion } from '../api/delete-discussion';
 
 type DeleteDiscussionProps = {
   id: string;

src/features/discussions/components/DiscussionsList.tsx → src/features/discussions/components/discussions-list.tsx

@@ -3,10 +3,10 @@ import { Spinner } from '@/components/ui/spinner';
 import { Table } from '@/components/ui/table';
 import { formatDate } from '@/utils/format';
 
-import { useDiscussions } from '../api/getDiscussions';
+import { useDiscussions } from '../api/get-discussions';
 import { Discussion } from '../types';
 
-import { DeleteDiscussion } from './DeleteDiscussion';
+import { DeleteDiscussion } from './delete-discussion';
 
 export const DiscussionsList = () => {
   const discussionsQuery = useDiscussions();

src/features/discussions/components/UpdateDiscussion.tsx → src/features/discussions/components/update-discussion.tsx

@@ -5,8 +5,8 @@ import { Button } from '@/components/ui/button';
 import { Form, FormDrawer, Input, Textarea } from '@/components/ui/form';
 import { Authorization, ROLES } from '@/features/auth';
 
-import { useDiscussion } from '../api/getDiscussion';
-import { UpdateDiscussionDTO, useUpdateDiscussion } from '../api/updateDiscussion';
+import { useDiscussion } from '../api/get-discussion';
+import { UpdateDiscussionDTO, useUpdateDiscussion } from '../api/update-discussion';
 
 type UpdateDiscussionProps = {
   discussionId: string;

src/features/discussions/index.ts

@@ -1,3 +1,3 @@
 export * from './types';
-export * from './routes/Discussion';
-export * from './routes/Discussions';
+export * from './routes/discussion';
+export * from './routes/discussions';

src/features/discussions/routes/__tests__/Discussion.test.tsx → src/features/discussions/routes/__tests__/discussion.test.tsx

@@ -11,7 +11,7 @@ import {
   within,
 } from '@/test/test-utils';
 
-import { DiscussionRoute } from '../Discussion';
+import { DiscussionRoute } from '../discussion';
 
 vi.mock('react-router-dom', () => ({
   ...vi.importActual('react-router-dom'), // keep the rest of the exports intact

src/features/discussions/routes/__tests__/Discussions.test.tsx → src/features/discussions/routes/__tests__/discussions.test.tsx

@@ -4,7 +4,7 @@ import { discussionGenerator } from '@/test/data-generators';
 import { renderApp, screen, userEvent, waitFor, within } from '@/test/test-utils';
 import { formatDate } from '@/utils/format';
 
-import { DiscussionsRoute } from '../Discussions';
+import { DiscussionsRoute } from '../discussions';
 
 beforeAll(() => {
   vi.spyOn(console, 'error').mockImplementation(() => {});

src/features/discussions/routes/Discussion.tsx → src/features/discussions/routes/discussion.tsx

@@ -7,8 +7,8 @@ import { Spinner } from '@/components/ui/spinner';
 import { Comments } from '@/features/comments';
 import { formatDate } from '@/utils/format';
 
-import { useDiscussion } from '../api/getDiscussion';
-import { UpdateDiscussion } from '../components/UpdateDiscussion';
+import { useDiscussion } from '../api/get-discussion';
+import { UpdateDiscussion } from '../components/update-discussion';
 
 export const DiscussionRoute = () => {
   const params = useParams();

src/features/discussions/routes/Discussions.tsx → src/features/discussions/routes/discussions.tsx

@@ -1,7 +1,7 @@
 import { ContentLayout } from '@/components/layouts';
 
-import { CreateDiscussion } from '../components/CreateDiscussion';
-import { DiscussionsList } from '../components/DiscussionsList';
+import { CreateDiscussion } from '../components/create-discussion';
+import { DiscussionsList } from '../components/discussions-list';
 
 export const DiscussionsRoute = () => {
   return (

src/features/misc/index.ts

@@ -1,3 +1,3 @@
-export * from './routes/Landing';
-export * from './routes/NotFound';
-export * from './routes/Dashboard';
+export * from './routes/landing';
+export * from './routes/not-found';
+export * from './routes/dashboard';

src/features/teams/index.ts

@@ -1,3 +1,3 @@
 export * from './types';
 
-export * from './api/getTeams';
+export * from './api/get-teams';

src/features/users/components/DeleteUser.tsx → src/features/users/components/delete-user.tsx

@@ -2,7 +2,7 @@ import { Button } from '@/components/ui/button';
 import { ConfirmationDialog } from '@/components/ui/dialog';
 import { useUser } from '@/features/auth';
 
-import { useDeleteUser } from '../api/deleteUser';
+import { useDeleteUser } from '../api/delete-user';
 
 type DeleteUserProps = {
   id: string;

src/features/users/components/UpdateProfile.tsx → src/features/users/components/update-profile.tsx

@@ -5,7 +5,7 @@ import { Button } from '@/components/ui/button';
 import { Form, FormDrawer, Input, Textarea } from '@/components/ui/form';
 import { useUser } from '@/features/auth';
 
-import { UpdateProfileDTO, useUpdateProfile } from '../api/updateProfile';
+import { UpdateProfileDTO, useUpdateProfile } from '../api/update-profile';
 
 const schema = z.object({
   email: z.string().min(1, 'Required'),

src/features/users/components/UsersList.tsx → src/features/users/components/users-list.tsx

@@ -2,10 +2,10 @@ import { Spinner } from '@/components/ui/spinner';
 import { Table } from '@/components/ui/table';
 import { formatDate } from '@/utils/format';
 
-import { useUsers } from '../api/getUsers';
+import { useUsers } from '../api/get-users';
 import { User } from '../types';
 
-import { DeleteUser } from './DeleteUser';
+import { DeleteUser } from './delete-user';
 
 export const UsersList = () => {
   const usersQuery = useUsers();

src/features/users/index.ts

@@ -1,4 +1,4 @@
 export * from './types';
 
-export * from './routes/Users';
-export * from './routes/Profile';
+export * from './routes/users';
+export * from './routes/profile';

src/features/users/routes/Profile.tsx → src/features/users/routes/profile.tsx

@@ -1,7 +1,7 @@
 import { ContentLayout } from '@/components/layouts';
 import { useUser } from '@/features/auth';
 
-import { UpdateProfile } from '../components/UpdateProfile';
+import { UpdateProfile } from '../components/update-profile';
 
 type EntryProps = {
   label: string;

src/features/users/routes/Users.tsx → src/features/users/routes/users.tsx

@@ -1,7 +1,7 @@
 import { ContentLayout } from '@/components/layouts';
 import { Authorization, ROLES } from '@/features/auth';
 
-import { UsersList } from '../components/UsersList';
+import { UsersList } from '../components/users-list';
 
 export const UsersRoute = () => {
   return (

src/hooks/__tests__/useDisclosure.test.ts → src/hooks/__tests__/use-disclosure.test.ts

@@ -1,6 +1,6 @@
 import { renderHook, act } from '@testing-library/react';
 
-import { useDisclosure } from '../useDisclosure';
+import { useDisclosure } from '../use-disclosure';
 
 test('should open the state', () => {
   const { result } = renderHook(() => useDisclosure());

src/routes/index.tsx

@@ -4,7 +4,7 @@ import { Routes, Route, Outlet } from 'react-router-dom';
 import { DashboardLayout } from '@/components/layouts';
 import { Spinner } from '@/components/ui/spinner';
 import { ProtectedRoute } from '@/features/auth';
-import { lazyImport } from '@/utils/lazyImport';
+import { lazyImport } from '@/utils/lazy-import';
 
 const { DashboardRoute } = lazyImport(() => import('@/features/misc'), 'DashboardRoute');
 const { ProfileRoute } = lazyImport(() => import('@/features/users'), 'ProfileRoute');

vite.config.ts

@@ -14,7 +14,7 @@ export default defineConfig({
   test: {
     globals: true,
     environment: 'jsdom',
-    setupFiles: './src/setupTests.ts',
+    setupFiles: './src/setup-tests.ts',
     exclude: ['**/node_modules/**', '**/e2e/**'],
     coverage: {
       include: ['src/**'],