Skip to content

Commit 076a5e5

Browse files
committed
make work with relative path
1 parent e791162 commit 076a5e5

20 files changed

+1026
-935
lines changed

packages/frontend/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,14 @@
1313
"@aws-sdk/s3-request-presigner": "3.245.0",
1414
"@aws-sdk/util-create-request": "3.234.0",
1515
"@aws-sdk/util-format-url": "3.226.0",
16-
"@reach/router": "1.3.4",
1716
"buffer": "6.0.3",
1817
"events": "^3.3.0",
1918
"microphone-stream": "6.0.1",
2019
"process": "0.11.10",
2120
"react": "18.2.0",
2221
"react-bootstrap": "1.4.0",
2322
"react-dom": "18.2.0",
23+
"react-router-dom": "^6.20.0",
2424
"util": "^0.12.5"
2525
},
2626
"scripts": {

packages/frontend/src/Routes.tsx

Lines changed: 17 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,24 @@
1-
import React, { lazy, Suspense } from "react";
2-
import { Router } from "@reach/router";
1+
import React from "react";
2+
import { Suspense } from "react";
3+
import { BrowserRouter, Route, Routes as RouterRoutes } from "react-router-dom";
4+
import ListNotes from "./content/ListNotes";
5+
import CreateNote from "./content/CreateNote";
6+
import ShowNote from "./content/ShowNote";
7+
import NotFound from "./content/NotFound";
38

4-
const ListNotes = lazy(() => import("./content/ListNotes"));
5-
const CreateNote = lazy(() => import("./content/CreateNote"));
6-
const ShowNote = lazy(() => import("./content/ShowNote"));
7-
const NotFound = lazy(() => import("./content/NotFound"));
9+
import { BASE_URL } from "./config";
810

9-
const Routes = () => (
11+
const Routes = () => (
1012
<div className="mt-md-4 d-flex flex-column justify-content-center">
1113
<Suspense fallback={<div>Loading...</div>}>
12-
<Router>
13-
<ListNotes path="/" />
14-
<CreateNote path="/note/new" />
15-
<ShowNote path="/notes/:noteId" />
16-
<NotFound default />
17-
</Router>
14+
<BrowserRouter basename={BASE_URL}>
15+
<RouterRoutes>
16+
<Route path="/" element={<ListNotes/>} />
17+
<Route path="/note/new" element={<CreateNote/>} />
18+
<Route path="/notes/:noteId" element={<ShowNote/>} />
19+
<Route element={<NotFound/>} />
20+
</RouterRoutes>
21+
</BrowserRouter>
1822
</Suspense>
1923
</div>
2024
);

packages/frontend/src/config.json

Lines changed: 0 additions & 7 deletions
This file was deleted.

packages/frontend/src/config.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
export const GATEWAY_URL = import.meta.env.VITE_GATEWAY_URL;
2+
export const MAX_FILE_SIZE = 500000;
3+
export const FILES_BUCKET = import.meta.env.VITE_FILES_BUCKET;
4+
export const REGION = import.meta.env.VITE_REGION;
5+
export const IDENTITY_POOL_ID = import.meta.env.VITE_IDENTITY_POOL_ID;
6+
export const BASE_URL = import.meta.env.BASE_URL;

packages/frontend/src/content/CreateNote.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,18 @@
11
import React, { useState, FormEvent } from "react";
22
import { Form, Button, Alert } from "react-bootstrap";
3-
import { navigate, RouteComponentProps } from "@reach/router";
4-
import { GATEWAY_URL, MAX_FILE_SIZE } from "../config.json";
3+
import { GATEWAY_URL, MAX_FILE_SIZE } from "../config";
54
import { putObject } from "../libs";
65
import { HomeButton, ButtonSpinner, PageContainer } from "../components";
6+
import { useNavigate } from "react-router-dom";
77

8-
const CreateNote = (props: RouteComponentProps) => {
8+
const CreateNote = (): JSX.Element => {
99
const [isLoading, setIsLoading] = useState(false);
1010
const [errorMsg, setErrorMsg] = useState("");
1111
const [noteContent, setNoteContent] = useState("");
1212
const [file, setFile] = useState();
1313

14+
const navigate = useNavigate();
15+
1416
const handleSubmit = async (event: FormEvent<HTMLFormElement>) => {
1517
event.preventDefault();
1618

packages/frontend/src/content/DeleteNoteButton.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,17 @@
11
import React, { useState } from "react";
22
import { Button, Alert } from "react-bootstrap";
3-
import { GATEWAY_URL } from "../config.json";
4-
import { navigate } from "@reach/router";
3+
import { GATEWAY_URL } from "../config";
54
import { deleteObject } from "../libs";
65
import { ButtonSpinner } from "../components";
6+
import { useNavigate } from "react-router-dom";
77

88
const DeleteNoteButton = (props: { noteId: string; attachment?: string }) => {
99
const { noteId, attachment } = props;
1010
const [isDeleting, setIsDeleting] = useState(false);
1111
const [errorMsg, setErrorMsg] = useState("");
1212

13+
const navigate = useNavigate();
14+
1315
const handleDelete = async (event: any) => {
1416
event.preventDefault();
1517
setIsDeleting(true);

packages/frontend/src/content/ListNotes.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import React, { useState, useEffect } from "react";
2-
import { Link, RouteComponentProps } from "@reach/router";
3-
import { GATEWAY_URL } from "../config.json";
2+
import { GATEWAY_URL } from "../config";
43
import { Card, Alert, CardColumns, Button } from "react-bootstrap";
54
import { Loading, PageContainer } from "../components";
5+
import { Link } from "react-router-dom";
66
interface Note {
77
noteId: string;
88
createdAt: string;
99
content: string;
1010
attachment: boolean;
1111
}
1212

13-
const ListNotes = (props: RouteComponentProps) => {
13+
const ListNotes = (): JSX.Element => {
1414
const [isLoading, setIsLoading] = useState(true);
1515
const [errorMsg, setErrorMsg] = useState("");
1616
const [notes, setNotes] = useState([]);

packages/frontend/src/content/NotFound.tsx

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
1-
import React from "react";
2-
import { RouteComponentProps } from "@reach/router";
31
import { HomeButton, PageContainer } from "../components";
42

5-
const NotFound = (props: RouteComponentProps) => (
3+
const NotFound = (): JSX.Element => (
64
<PageContainer header={<HomeButton />}>404 Page Not Found</PageContainer>
75
);
86

packages/frontend/src/content/SaveNoteButton.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
11
import React, { useState } from "react";
22
import { Button, Alert } from "react-bootstrap";
3-
import { GATEWAY_URL } from "../config.json";
4-
import { navigate } from "@reach/router";
3+
import { GATEWAY_URL } from "../config";
54
import { ButtonSpinner } from "../components";
5+
import { useNavigate } from "react-router-dom";
66

77
const SaveNoteButton = (props: { noteId: string; noteContent: string }) => {
88
const [isSaving, setIsSaving] = useState(false);
99
const [errorMsg, setErrorMsg] = useState("");
1010

11+
const navigate = useNavigate();
12+
1113
const handleSave = async (event: any) => {
1214
event.preventDefault();
1315
setIsSaving(true);

packages/frontend/src/content/ShowNote.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,18 @@
11
import React, { useState, useEffect } from "react";
2-
import { RouteComponentProps, navigate } from "@reach/router";
32
import { Form, Card } from "react-bootstrap";
4-
import { GATEWAY_URL } from "../config.json";
3+
import { GATEWAY_URL } from "../config";
54
import { DeleteNoteButton, SaveNoteButton } from "./";
65
import { getObjectUrl } from "../libs";
76
import { HomeButton, Loading, PageContainer } from "../components";
7+
import { useNavigate, useParams } from "react-router-dom";
88

9-
const ShowNote = (props: RouteComponentProps<{ noteId: string }>) => {
10-
const { noteId } = props;
9+
const ShowNote = () => {
10+
const { noteId } = useParams<'noteId'>();
1111
const [isLoading, setIsLoading] = useState(true);
1212
const [noteContent, setNoteContent] = useState("");
1313
const [attachment, setAttachment] = useState("");
1414
const [attachmentURL, setAttachmentURL] = useState("");
15+
const navigate = useNavigate();
1516

1617
useEffect(() => {
1718
const fetchNote = async (noteId: string) => {

0 commit comments

Comments
 (0)