From b930b0cec5d00386515b5dd1b1d302c1453f656e Mon Sep 17 00:00:00 2001 From: Marc Cataford Date: Thu, 4 Jan 2024 13:57:02 -0500 Subject: [PATCH] build(fe-paths): update convoluted relative paths to absolutes with alias --- frontend/package.json | 4 ++-- frontend/src/App.tsx | 16 ++++++++-------- .../FileDetails/FileDetails.test.tsx | 8 ++++---- frontend/src/components/FileDetails/index.tsx | 10 +++------- .../src/components/FileList/FileList.test.tsx | 2 +- frontend/src/components/FileList/index.tsx | 10 +++++----- .../FileListView/FileListView.test.tsx | 4 ++-- frontend/src/components/FileListView/index.tsx | 8 ++++---- .../components/LoginView/LoginView.test.tsx | 4 ++-- frontend/src/components/LoginView/index.tsx | 6 +++--- frontend/src/components/LogoutView/index.tsx | 2 +- .../NavigationBar/NavigationBar.test.tsx | 6 +++--- .../src/components/NavigationBar/index.tsx | 6 +++--- .../RegisterView/RegisterView.test.tsx | 2 +- frontend/src/components/RegisterView/index.tsx | 4 ++-- frontend/src/hooks/files.ts | 4 ++-- frontend/src/queries/auth.test.tsx | 4 ++-- frontend/src/queries/auth.ts | 5 +++-- frontend/src/queries/user.test.tsx | 2 +- frontend/src/queries/user.ts | 2 +- frontend/src/router/Router.test.tsx | 2 +- frontend/src/router/Router.tsx | 2 +- frontend/src/tests/helpers.tsx | 4 ++-- frontend/tsconfig.json | 6 +++++- frontend/vite.config.js | 18 ++++++++++++++++-- 25 files changed, 78 insertions(+), 63 deletions(-) diff --git a/frontend/package.json b/frontend/package.json index b309f82..6e6ca43 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -12,10 +12,10 @@ }, "scripts": { "start": "vite ./src --config ./vite.config.js", - "build": "vite build ./src", + "build": "vite build ./src --config ./vite.config.js", "lint": "biome check src *.js --verbose && biome format src *.js --verbose", "lint:fix": "biome check src ./*.js --apply --verbose && biome format src ./*.js --write --verbose", - "test": "yarn vitest run src", + "test": "yarn vitest run", "typecheck": "yarn tsc --noEmit" }, "devDependencies": { diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 0031c17..6f28c92 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -5,16 +5,16 @@ import { useQuery, } from "@tanstack/react-query" -import NavigationBar from "./components/NavigationBar" -import AsyncTaskContext from "./contexts/AsyncTaskContext" -import LocationContext from "./contexts/LocationContext" +import NavigationBar from "@/components/NavigationBar" +import AsyncTaskContext from "@/contexts/AsyncTaskContext" +import LocationContext from "@/contexts/LocationContext" -import { Router, Route } from "./router" +import { Router, Route } from "@/router" -import FileListView from "./components/FileListView" -import RegisterView from "./components/RegisterView" -import LoginView from "./components/LoginView" -import LogoutView from "./components/LogoutView" +import FileListView from "@/components/FileListView" +import RegisterView from "@/components/RegisterView" +import LoginView from "@/components/LoginView" +import LogoutView from "@/components/LogoutView" const routeLabels = { ITEM_DETAILS: "item-details", diff --git a/frontend/src/components/FileDetails/FileDetails.test.tsx b/frontend/src/components/FileDetails/FileDetails.test.tsx index 8adf42c..b5cfaff 100644 --- a/frontend/src/components/FileDetails/FileDetails.test.tsx +++ b/frontend/src/components/FileDetails/FileDetails.test.tsx @@ -7,11 +7,11 @@ import { type UseQueryResult } from "@tanstack/react-query" import { renderWithContexts as render, getAxiosMockAdapter, -} from "../../tests/helpers" +} from "@/tests/helpers" import FileDetails from "." -import { type FileData } from "../../types/files" -import * as fileQueries from "../../hooks/files" -import * as locationContextUtils from "../../contexts/LocationContext" +import { type FileData } from "@/types/files" +import * as fileQueries from "@/hooks/files" +import * as locationContextUtils from "@/contexts/LocationContext" describe("FileDetails", () => { const mockItem = { diff --git a/frontend/src/components/FileDetails/index.tsx b/frontend/src/components/FileDetails/index.tsx index 3b5cb89..43456ef 100644 --- a/frontend/src/components/FileDetails/index.tsx +++ b/frontend/src/components/FileDetails/index.tsx @@ -6,13 +6,9 @@ import MuiDeleteIcon from "@mui/icons-material/Delete" import MuiDownloadIcon from "@mui/icons-material/Download" import MuiIconButton from "@mui/material/IconButton" -import { byteSizeToUnits } from "../../utils" -import { useLocationContext } from "../../contexts/LocationContext" -import { - useFileDetails, - useFileMutations, - useFileFetches, -} from "../../hooks/files" +import { byteSizeToUnits } from "@/utils" +import { useLocationContext } from "@/contexts/LocationContext" +import { useFileDetails, useFileMutations, useFileFetches } from "@/hooks/files" interface FileDetailsProps { itemId: string diff --git a/frontend/src/components/FileList/FileList.test.tsx b/frontend/src/components/FileList/FileList.test.tsx index 49169a3..6c684f7 100644 --- a/frontend/src/components/FileList/FileList.test.tsx +++ b/frontend/src/components/FileList/FileList.test.tsx @@ -5,7 +5,7 @@ import userEvent from "@testing-library/user-event" import { renderWithContexts as render, getAxiosMockAdapter, -} from "../../tests/helpers" +} from "@/tests/helpers" import FileList from "." import AxiosMockAdapter from "axios-mock-adapter" diff --git a/frontend/src/components/FileList/index.tsx b/frontend/src/components/FileList/index.tsx index 4c302a9..dda74f6 100644 --- a/frontend/src/components/FileList/index.tsx +++ b/frontend/src/components/FileList/index.tsx @@ -11,11 +11,11 @@ import MuiListItemIcon from "@mui/material/ListItemIcon" import MuiIconButton from "@mui/material/IconButton" import MuiTypography from "@mui/material/Typography" -import { byteSizeToUnits } from "../../utils" -import { useLocationContext } from "../../contexts/LocationContext" -import { useAsyncTaskContext } from "../../contexts/AsyncTaskContext" -import { useFileMutations, useFileFetches } from "../../hooks/files" -import { type FileData } from "../../types/files" +import { byteSizeToUnits } from "@/utils" +import { useLocationContext } from "@/contexts/LocationContext" +import { useAsyncTaskContext } from "@/contexts/AsyncTaskContext" +import { useFileMutations, useFileFetches } from "@/hooks/files" +import { type FileData } from "@/types/files" interface FileListProps { data: Array } diff --git a/frontend/src/components/FileListView/FileListView.test.tsx b/frontend/src/components/FileListView/FileListView.test.tsx index 73129b5..d13df29 100644 --- a/frontend/src/components/FileListView/FileListView.test.tsx +++ b/frontend/src/components/FileListView/FileListView.test.tsx @@ -3,8 +3,8 @@ import { render, screen, waitFor } from "@testing-library/react" import { QueryClientProvider, QueryClient } from "@tanstack/react-query" import AxiosMockAdapter from "axios-mock-adapter" -import axios from "../../axios" -import { LocationContext } from "../../contexts/LocationContext" +import axios from "@/axios" +import { LocationContext } from "@/contexts/LocationContext" import FileListView from "." const routes = { diff --git a/frontend/src/components/FileListView/index.tsx b/frontend/src/components/FileListView/index.tsx index 568dc13..040c0f4 100644 --- a/frontend/src/components/FileListView/index.tsx +++ b/frontend/src/components/FileListView/index.tsx @@ -2,10 +2,10 @@ import React from "react" import Box from "@mui/material/Box" -import FileList from "../FileList" -import FileDetails from "../FileDetails" -import { useOwnFileList } from "../../hooks/files" -import { useLocationContext } from "../../contexts/LocationContext" +import FileList from "@/components/FileList" +import FileDetails from "@/components/FileDetails" +import { useOwnFileList } from "@/hooks/files" +import { useLocationContext } from "@/contexts/LocationContext" function FileListView() { const { isLoading, data } = useOwnFileList() diff --git a/frontend/src/components/LoginView/LoginView.test.tsx b/frontend/src/components/LoginView/LoginView.test.tsx index 583e49b..a5873ad 100644 --- a/frontend/src/components/LoginView/LoginView.test.tsx +++ b/frontend/src/components/LoginView/LoginView.test.tsx @@ -5,8 +5,8 @@ import userEvent from "@testing-library/user-event" import { QueryClientProvider, QueryClient } from "@tanstack/react-query" import AxiosMockAdapter from "axios-mock-adapter" -import axios from "../../axios" -import * as locationHook from "../../contexts/LocationContext" +import axios from "@/axios" +import * as locationHook from "@/contexts/LocationContext" import LoginView from "." function renderComponent() { diff --git a/frontend/src/components/LoginView/index.tsx b/frontend/src/components/LoginView/index.tsx index 5112be3..1f89459 100644 --- a/frontend/src/components/LoginView/index.tsx +++ b/frontend/src/components/LoginView/index.tsx @@ -10,9 +10,9 @@ import Button from "@mui/material/Button" import Link from "@mui/material/Link" import Alert from "@mui/material/Alert" -import { useLogin } from "../../queries/auth" -import axiosWithDefaults from "../../axios" -import TextInput from "../TextInput" +import { useLogin } from "@/queries/auth" +import axiosWithDefaults from "@/axios" +import TextInput from "@/components/TextInput" function LoginView() { const [emailAddress, setEmailAddress] = React.useState("") diff --git a/frontend/src/components/LogoutView/index.tsx b/frontend/src/components/LogoutView/index.tsx index b9fb326..2016ef4 100644 --- a/frontend/src/components/LogoutView/index.tsx +++ b/frontend/src/components/LogoutView/index.tsx @@ -2,7 +2,7 @@ import React from "react" import Box from "@mui/material/Box" import Typography from "@mui/material/Typography" -import { useLogout } from "../../queries/auth" +import { useLogout } from "@/queries/auth" function LogoutView() { const { logout } = useLogout() diff --git a/frontend/src/components/NavigationBar/NavigationBar.test.tsx b/frontend/src/components/NavigationBar/NavigationBar.test.tsx index 356a7a6..f644c53 100644 --- a/frontend/src/components/NavigationBar/NavigationBar.test.tsx +++ b/frontend/src/components/NavigationBar/NavigationBar.test.tsx @@ -4,11 +4,11 @@ import userEvent from "@testing-library/user-event" import { screen, render, waitFor } from "@testing-library/react" import { QueryClientProvider, QueryClient } from "@tanstack/react-query" -import * as locationHook from "../../contexts/LocationContext" -import { getAxiosMockAdapter } from "../../tests/helpers" +import * as locationHook from "@/contexts/LocationContext" +import { getAxiosMockAdapter } from "@/tests/helpers" import NavigationBar from "." -import { type FileData } from "../../types/files" +import { type FileData } from "@/types/files" function renderComponent() { const wrapper = ({ children }: { children: React.ReactNode }) => ( diff --git a/frontend/src/components/NavigationBar/index.tsx b/frontend/src/components/NavigationBar/index.tsx index 759f165..5a2b554 100644 --- a/frontend/src/components/NavigationBar/index.tsx +++ b/frontend/src/components/NavigationBar/index.tsx @@ -7,9 +7,9 @@ import Button from "@mui/material/Button" import Typography from "@mui/material/Typography" import UploadIcon from "@mui/icons-material/Upload" -import { useFileMutations } from "../../hooks/files" -import { useLogout } from "../../queries/auth" -import { useCurrentUser } from "../../queries/user" +import { useFileMutations } from "@/hooks/files" +import { useLogout } from "@/queries/auth" +import { useCurrentUser } from "@/queries/user" function UploadFileButton() { const fileRef = useRef(null) diff --git a/frontend/src/components/RegisterView/RegisterView.test.tsx b/frontend/src/components/RegisterView/RegisterView.test.tsx index e61a8e1..1b02c82 100644 --- a/frontend/src/components/RegisterView/RegisterView.test.tsx +++ b/frontend/src/components/RegisterView/RegisterView.test.tsx @@ -4,7 +4,7 @@ import userEvent from "@testing-library/user-event" import { QueryClientProvider, QueryClient } from "@tanstack/react-query" import AxiosMockAdapter from "axios-mock-adapter" -import axios from "../../axios" +import axios from "@/axios" import RegisterView from "." function renderComponent() { diff --git a/frontend/src/components/RegisterView/index.tsx b/frontend/src/components/RegisterView/index.tsx index f93ff49..33631cc 100644 --- a/frontend/src/components/RegisterView/index.tsx +++ b/frontend/src/components/RegisterView/index.tsx @@ -10,8 +10,8 @@ import InputLabel from "@mui/material/InputLabel" import FormHelperText from "@mui/material/FormHelperText" import Button from "@mui/material/Button" -import axiosWithDefaults from "../../axios" -import TextInput from "../TextInput" +import axiosWithDefaults from "@/axios" +import TextInput from "@/components/TextInput" import { validateEmail, validatePassword } from "./validation" function RegisterView() { diff --git a/frontend/src/hooks/files.ts b/frontend/src/hooks/files.ts index 1546cd8..c59963f 100644 --- a/frontend/src/hooks/files.ts +++ b/frontend/src/hooks/files.ts @@ -1,7 +1,7 @@ import { useQuery, useQueryClient } from "@tanstack/react-query" -import axios from "../axios" -import { type FileData } from "../types/files" +import axios from "@/axios" +import { type FileData } from "@/types/files" function useOwnFileList() { return useQuery({ diff --git a/frontend/src/queries/auth.test.tsx b/frontend/src/queries/auth.test.tsx index 083691b..262b4df 100644 --- a/frontend/src/queries/auth.test.tsx +++ b/frontend/src/queries/auth.test.tsx @@ -4,8 +4,8 @@ import { renderHook, waitFor } from "@testing-library/react" import { QueryClientProvider, QueryClient } from "@tanstack/react-query" import AxiosMockAdapter from "axios-mock-adapter" -import * as locationHook from "../contexts/LocationContext" -import axiosWithDefaults from "../axios" +import * as locationHook from "@/contexts/LocationContext" +import axiosWithDefaults from "@/axios" import { useLogout } from "./auth" function WithProviders({ children }: { children: React.ReactNode }) { diff --git a/frontend/src/queries/auth.ts b/frontend/src/queries/auth.ts index 2f38922..a10767b 100644 --- a/frontend/src/queries/auth.ts +++ b/frontend/src/queries/auth.ts @@ -6,8 +6,9 @@ * */ import { useQueryClient, useMutation } from "@tanstack/react-query" -import { useLocationContext } from "../contexts/LocationContext" -import axiosWithDefaults from "../axios" + +import { useLocationContext } from "@/contexts/LocationContext" +import axiosWithDefaults from "@/axios" /* * Handles the log-out interaction. diff --git a/frontend/src/queries/user.test.tsx b/frontend/src/queries/user.test.tsx index b22338c..ebddb9c 100644 --- a/frontend/src/queries/user.test.tsx +++ b/frontend/src/queries/user.test.tsx @@ -4,7 +4,7 @@ import { renderHook, waitFor } from "@testing-library/react" import { QueryClientProvider, QueryClient } from "@tanstack/react-query" import AxiosMockAdapter from "axios-mock-adapter" -import axiosWithDefaults from "../axios" +import axiosWithDefaults from "@/axios" import { useCurrentUser } from "./user" function WithProviders({ children }: { children: React.ReactNode }) { diff --git a/frontend/src/queries/user.ts b/frontend/src/queries/user.ts index a3b8eb1..318a9f6 100644 --- a/frontend/src/queries/user.ts +++ b/frontend/src/queries/user.ts @@ -1,6 +1,6 @@ import { useQuery } from "@tanstack/react-query" -import axiosWithDefaults from "../axios" +import axiosWithDefaults from "@/axios" /* * Current user data fetch. diff --git a/frontend/src/router/Router.test.tsx b/frontend/src/router/Router.test.tsx index e33ac5c..0465afc 100644 --- a/frontend/src/router/Router.test.tsx +++ b/frontend/src/router/Router.test.tsx @@ -1,7 +1,7 @@ import { afterEach, describe, it, vi, expect } from "vitest" import { render, screen } from "@testing-library/react" -import { LocationContext } from "../contexts/LocationContext" +import { LocationContext } from "@/contexts/LocationContext" import Router from "./Router" import Route from "./Route" diff --git a/frontend/src/router/Router.tsx b/frontend/src/router/Router.tsx index c4bcfc3..a1f5bef 100644 --- a/frontend/src/router/Router.tsx +++ b/frontend/src/router/Router.tsx @@ -1,6 +1,6 @@ import React, { Children } from "react" -import { useLocationContext } from "../contexts/LocationContext" +import { useLocationContext } from "@/contexts/LocationContext" interface RouterProps { children: React.ReactNode diff --git a/frontend/src/tests/helpers.tsx b/frontend/src/tests/helpers.tsx index aa73ac5..ccdb8cd 100644 --- a/frontend/src/tests/helpers.tsx +++ b/frontend/src/tests/helpers.tsx @@ -4,8 +4,8 @@ import { QueryClientProvider, QueryClient } from "@tanstack/react-query" import axios from "../axios" import AxiosMockAdapter from "axios-mock-adapter" -import AsyncTaskContext, { type AsyncTask } from "../contexts/AsyncTaskContext" -import LocationContext from "../contexts/LocationContext" +import AsyncTaskContext, { type AsyncTask } from "@/contexts/AsyncTaskContext" +import LocationContext from "@/contexts/LocationContext" interface ContextInitialValues { asyncTaskContext: Array diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json index 0011826..9a76598 100644 --- a/frontend/tsconfig.json +++ b/frontend/tsconfig.json @@ -11,6 +11,10 @@ "strict": true, "noImplicitAny": true, "skipLibCheck": true, - "types": ["node", "mocha"] + "types": ["node", "mocha"], + "baseUrl": ".", + "paths": { + "@/*": ["./src/*"] + } } } diff --git a/frontend/vite.config.js b/frontend/vite.config.js index 4fe8acd..da7d7f6 100644 --- a/frontend/vite.config.js +++ b/frontend/vite.config.js @@ -1,10 +1,16 @@ import legacy from "@vitejs/plugin-legacy" import basicSSL from "@vitejs/plugin-basic-ssl" - +import path from "node:path" import { defineConfig } from "vite" export default defineConfig({ plugins: [legacy(), basicSSL()], + build: { + outDir: "./dist", + rollupOptions: { + external: "./src", + }, + }, server: { port: 1234, strictPort: true, @@ -13,7 +19,15 @@ export default defineConfig({ test: { environment: "jsdom", setupFiles: ["./src/tests/testSetup.ts"], - testMatch: ["./src/**/*.test.tsx?"], + include: ["./src/**/*.test.ts", "./src/**/*.test.tsx"], globals: true, }, + resolve: { + alias: [ + { + find: "@", + replacement: path.resolve(__dirname, "./src"), + }, + ], + }, })