From 207cafa32916affd88f16471708acf2ecf3cf09c Mon Sep 17 00:00:00 2001
From: natalie <22222885+espeon@users.noreply.github.com>
Date: Tue, 31 Dec 2024 12:20:38 -0600
Subject: [PATCH] add proper titling
---
index.html | 2 +-
src/hooks/useDocumentTitle.tsx | 7 +++++++
src/routes/at:/$handle.$collection.$rkey.lazy.tsx | 7 +++++++
src/routes/at:/$handle.index.tsx | 5 +++++
src/routes/at:/$handle/$collection.index.lazy.tsx | 3 +++
5 files changed, 23 insertions(+), 1 deletion(-)
create mode 100644 src/hooks/useDocumentTitle.tsx
diff --git a/index.html b/index.html
index 6bd6be9..07ab6d8 100644
--- a/index.html
+++ b/index.html
@@ -4,7 +4,7 @@
- Vite + Preact + TS
+ atp.tools
diff --git a/src/hooks/useDocumentTitle.tsx b/src/hooks/useDocumentTitle.tsx
new file mode 100644
index 0000000..2c0c171
--- /dev/null
+++ b/src/hooks/useDocumentTitle.tsx
@@ -0,0 +1,7 @@
+import { useEffect } from "react";
+
+export function useDocumentTitle(title: string) {
+ useEffect(() => {
+ document.title = title;
+ }, [title]);
+}
diff --git a/src/routes/at:/$handle.$collection.$rkey.lazy.tsx b/src/routes/at:/$handle.$collection.$rkey.lazy.tsx
index efd0384..ffa6e83 100644
--- a/src/routes/at:/$handle.$collection.$rkey.lazy.tsx
+++ b/src/routes/at:/$handle.$collection.$rkey.lazy.tsx
@@ -1,4 +1,5 @@
import { RenderJson } from "@/components/renderJson";
+import { useDocumentTitle } from "@/hooks/useDocumentTitle";
import { QtClient, useXrpc } from "@/providers/qtprovider";
import "@atcute/bluesky/lexicons";
import {
@@ -97,6 +98,12 @@ function RouteComponent() {
rkey,
);
+ useDocumentTitle(
+ repoInfo
+ ? `${repoInfo?.handle ? `${repoInfo.handle} | ` : ""}${collection} | atp.tools`
+ : "atp.tools",
+ );
+
if (error) {
return Error: {error.message}
;
}
diff --git a/src/routes/at:/$handle.index.tsx b/src/routes/at:/$handle.index.tsx
index ad6fa7c..d631d18 100644
--- a/src/routes/at:/$handle.index.tsx
+++ b/src/routes/at:/$handle.index.tsx
@@ -1,4 +1,5 @@
import RepoIcons from "@/components/repoIcons";
+import { useDocumentTitle } from "@/hooks/useDocumentTitle";
import { QtClient, useXrpc } from "@/providers/qtprovider";
import "@atcute/bluesky/lexicons";
import {
@@ -29,6 +30,10 @@ function useRepoData(handle: string): RepoData {
error: null,
});
+ useDocumentTitle(
+ state.data?.handle ? `${state.data.handle} | atp.tools` : "atp.tools",
+ );
+
useEffect(() => {
const abortController = new AbortController();
diff --git a/src/routes/at:/$handle/$collection.index.lazy.tsx b/src/routes/at:/$handle/$collection.index.lazy.tsx
index cb2c4dc..b917a81 100644
--- a/src/routes/at:/$handle/$collection.index.lazy.tsx
+++ b/src/routes/at:/$handle/$collection.index.lazy.tsx
@@ -1,3 +1,4 @@
+import { useDocumentTitle } from "@/hooks/useDocumentTitle";
import { QtClient } from "@/providers/qtprovider";
import { ComAtprotoRepoListRecords } from "@atcute/client/lexicons";
import {
@@ -89,6 +90,8 @@ function RouteComponent() {
useCollectionRecords(handle, collection);
const loaderRef = useRef(null);
+ useDocumentTitle(records ? `${collection} | atp.tools` : "atp.tools");
+
useEffect(() => {
if (!loaderRef.current) return;
--
2.51.2