diff --git a/README.md b/README.md index 402ec4d..bbca9bf 100644 --- a/README.md +++ b/README.md @@ -1 +1,33 @@ -TBC +# eolas-app + +A React web app that serves as the frontend for my Zettelkasten, Eolas. + +eolas-app is a constituent part of my knowledge management system comprising [eolas](https://forgejo.systemsobscure.net/thomasabishop/eolas), +[eolas-db](https://forgejo.systemsobscure.net/thomasabishop/eolas-db), and [eolas-api](https://forgejo.systemsobscure.net/thomasabishop/eolas-api). + +It sources its data from +[eolas-api](https://forgejo.systemsobscure.net/thomasabishop/eolas-api) also +running on my VPS. + +## Local development + +```sh +npm install +npm run dev +``` + +This will use Vite to start the application at `http://localhost:5173`. The +application requires a local instance of `eolas-api` to be running, specified +via the environment variable `VITE_EOLAS_API_ENDPOINT` in a `.env`. + +Alternatively use the production API URL. + +## Deployment + +The application is deployed to my remote VPS, residing at `/var/www/eolas-app`. + +It is publicly accessible at +[eolas.systemsobscure.net](https://eolas.systemsobscure.net). + +Deployment is automated via a [Forgejo action](https://forgejo.systemsobscure.net/thomasabishop/eolas-app/src/branch/main/.forgejo/workflows/deploy.yaml) that builds the Webpack bundle +and transfers it to the VPS. Deployment actions are always executed by the `deploy` user on the VPS. diff --git a/index.html b/index.html index 3dfebe1..0c6d8e7 100644 --- a/index.html +++ b/index.html @@ -1,20 +1,18 @@ - - - - - - - Vite + React + TS - + + + + + + + E贸las + + + +
+ + - -
- - diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png new file mode 100644 index 0000000..8472f89 Binary files /dev/null and b/public/apple-touch-icon.png differ diff --git a/public/favicon-96x96.png b/public/favicon-96x96.png new file mode 100644 index 0000000..ca9756b Binary files /dev/null and b/public/favicon-96x96.png differ diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..b465137 Binary files /dev/null and b/public/favicon.ico differ diff --git a/public/favicon.svg b/public/favicon.svg new file mode 100644 index 0000000..e63e504 --- /dev/null +++ b/public/favicon.svg @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/public/site.webmanifest b/public/site.webmanifest new file mode 100644 index 0000000..ccf313a --- /dev/null +++ b/public/site.webmanifest @@ -0,0 +1,21 @@ +{ + "name": "MyWebSite", + "short_name": "MySite", + "icons": [ + { + "src": "/web-app-manifest-192x192.png", + "sizes": "192x192", + "type": "image/png", + "purpose": "maskable" + }, + { + "src": "/web-app-manifest-512x512.png", + "sizes": "512x512", + "type": "image/png", + "purpose": "maskable" + } + ], + "theme_color": "#ffffff", + "background_color": "#ffffff", + "display": "standalone" +} \ No newline at end of file diff --git a/public/vite.svg b/public/vite.svg deleted file mode 100644 index e7b8dfb..0000000 --- a/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/web-app-manifest-192x192.png b/public/web-app-manifest-192x192.png new file mode 100644 index 0000000..1e52191 Binary files /dev/null and b/public/web-app-manifest-192x192.png differ diff --git a/public/web-app-manifest-512x512.png b/public/web-app-manifest-512x512.png new file mode 100644 index 0000000..295a191 Binary files /dev/null and b/public/web-app-manifest-512x512.png differ diff --git a/src/components/EntryReferences.tsx b/src/components/EntryReferences.tsx index 458fd4f..607b208 100644 --- a/src/components/EntryReferences.tsx +++ b/src/components/EntryReferences.tsx @@ -22,24 +22,6 @@ export default function EntryReferences({ entryTitle }) { return (
-
-

Tags

- - {tags?.count} - -
-
- {tags?.data.map((item, i) => ( - - {item} - - ))} -
-

Incoming links

@@ -59,9 +41,7 @@ export default function EntryReferences({ entryTitle }) { ))}
-
-

Outgoing links

@@ -82,6 +62,26 @@ export default function EntryReferences({ entryTitle }) { ))}
+ +
+
+

Tags

+ + {tags?.count} + +
+
+ {tags?.data.map((item, i) => ( + + {item} + + ))} +
+
) } diff --git a/src/containers/Entry.tsx b/src/containers/Entry.tsx index 7d82106..757be3f 100644 --- a/src/containers/Entry.tsx +++ b/src/containers/Entry.tsx @@ -2,7 +2,7 @@ import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "@/componen import EntryBody from "@/components/EntryBody" import EntryMetadata from "@/containers/EntryMetadata" -export default function Entry({ entryTitle, entryBody, isLoading }) { +export default function Entry({ entryTitle, entryBody, history, metadata, isLoading }) { return ( @@ -13,7 +13,7 @@ export default function Entry({ entryTitle, entryBody, isLoading }) {
- +
diff --git a/src/containers/EntryMetadata.tsx b/src/containers/EntryMetadata.tsx index e169222..21d91b6 100644 --- a/src/containers/EntryMetadata.tsx +++ b/src/containers/EntryMetadata.tsx @@ -2,8 +2,10 @@ import EntryReferences from "@/components/EntryReferences" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { Bookmark } from "lucide-react" import { History } from "lucide-react" +import { Braces } from "lucide-react" -export default function EntryMetadata({ entryTitle }) { +export default function EntryMetadata({ entryTitle, history, metadata }) { + console.log(history) return ( @@ -22,13 +24,30 @@ export default function EntryMetadata({ entryTitle }) { History + + + + Metadata +
- + +
+

Last modified: {history.lastModified}

+
+ + +
+

Size on disk: {metadata.fileSize} B

+
+
) diff --git a/src/containers/RecentEdits.tsx b/src/containers/RecentEdits.tsx index a4e0865..55c64a7 100644 --- a/src/containers/RecentEdits.tsx +++ b/src/containers/RecentEdits.tsx @@ -22,7 +22,7 @@ const columns = [ }, cell: ({ cell, row }) => { return ( - + {row.original.title} @@ -46,7 +46,6 @@ export default function RecentEdits() { queryFn: () => api.get("/entries?limit=20&sort=date").then((res) => res.data), }) - console.log(data) const parsed = data?.data?.map((entry) => { const [date, time] = entry?.last_modified?.split(" ") return { @@ -57,6 +56,7 @@ export default function RecentEdits() { year: "numeric", }), time: time, + link: entry.title, } }) diff --git a/src/pages/home.tsx b/src/pages/home.tsx index aef46f3..9548fb6 100644 --- a/src/pages/home.tsx +++ b/src/pages/home.tsx @@ -1,8 +1,5 @@ import MainTemplate from "@/templates/MainTemplate" import RecentEdits from "@/containers/RecentEdits" -import { HoverCard, HoverCardContent, HoverCardTrigger } from "@/components/ui/hover-card" - -import { Button } from "@/components/ui/button" export default function Home() { return ( <> @@ -16,75 +13,22 @@ export default function Home() {

- {/* - - - - - - -

-
-

馃嚠馃嚜

-

- Irish for "knowledge", especially knowledge gained - through practical experience. -

-
-
- - - - */} - E贸las is{" "} + Hi,{" "} - my - {" "} - technical knowledge management system, or "second-brain", comprising - notes from the study of software engineering and computer - science.{" "} -

- -

- 馃嚠馃嚜 The word e贸las (pronounced "aw-lus") is Irish for - "knowledge", especially knowledge gained through practical experience. - 馃嚠馃嚜 + I'm Thomas + + , E贸las is my technical knowledge management system, or + "second-brain", comprising notes from the study of software + engineering and computer science.{" "}

- {/* - -
-

- {" "} - 馃嚠馃嚜 "E贸las" is Irish for "knowledge", - especially knowledge gained through practical experience. -

-
- - -I'm - - Thomas - - . - - - */}
diff --git a/src/templates/EntryTemplate.tsx b/src/templates/EntryTemplate.tsx index 710b6cf..d8bbc9a 100644 --- a/src/templates/EntryTemplate.tsx +++ b/src/templates/EntryTemplate.tsx @@ -16,7 +16,15 @@ export default function EntryTemplate() { return ( {entry?.replace(/_/g, " ")}} - pageBody={} + pageBody={ + + } /> ) }