fix: loading speeds

src/App.tsx

@@ -121,7 +121,7 @@ function BlisterLoader() {
 
 function App() {
   const [posts, setPosts] = useState<ManifestPost[]>([]);
-  const [state, setState] = useState<LoadState>("idle");
+  const [state, setState] = useState<LoadState>("loading");
   const [error, setError] = useState<string>("");
 
   useEffect(() => {
@@ -343,15 +343,31 @@ function PostPage({
   const permalink = post
     ? toPermalinkUrl(`/${post.slug}`)
     : toPermalinkUrl(location.pathname);
+  const metadataTitle =
+    state === "loading"
+      ? `${BLOG_NAME} | Loading`
+      : state === "error"
+      ? `${BLOG_NAME} | Error`
+      : post
+      ? `${title} | ${BLOG_NAME}`
+      : `${BLOG_NAME} | Post Not Found`;
+  const metadataDescription =
+    state === "loading"
+      ? `Loading ${BLOG_NAME}...`
+      : state === "error"
+      ? manifestError || BLOG_DEFAULT_DESCRIPTION
+      : post
+      ? description
+      : `Post not found on ${BLOG_NAME}.`;
 
   usePageMetadata({
-    title: post ? `${title} | ${BLOG_NAME}` : `${BLOG_NAME} | Post Not Found`,
+    title: metadataTitle,
-    description,
+    description: metadataDescription,
     path: location.pathname,
     image: bannerTxId ? arweaveUrl(bannerTxId) : undefined,
-    type: "article",
+    type: post ? "article" : "website",
-    publishedTime: postFrontmatter.date || post?.publishedAt,
+    publishedTime: post ? postFrontmatter.date || post.publishedAt : undefined,
-    modifiedTime: postFrontmatter.updated || post?.updated || undefined
+    modifiedTime: post ? postFrontmatter.updated || post.updated || undefined : undefined
   });
 
   if (state === "loading") return <BlisterLoader />;

src/lib.ts

@@ -113,14 +113,24 @@ const getLatestManifestFromAo = async (): Promise<string | null> => {
 };
 
 export const loadManifest = async (): Promise<ManifestPost[]> => {
-  const manifestTxId = (await getLatestManifestFromAo()) ?? MANIFEST_TX_ID;
+  const loadByTxId = async (manifestTxId: string): Promise<ManifestPost[]> => {
-  const response = await fetch(arweaveUrl(manifestTxId));
+    const response = await fetch(arweaveUrl(manifestTxId));
-  if (!response.ok) {
+    if (!response.ok) {
-    throw new Error(`Failed to load manifest (${response.status})`);
+      throw new Error(`Failed to load manifest (${response.status})`);
-  }
+    }
+    const payload: unknown = await response.json();
+    return parseManifest(payload);
+  };
 
-  const payload: unknown = await response.json();
+  try {
-  return parseManifest(payload);
+    return await loadByTxId(MANIFEST_TX_ID);
+  } catch (manifestError) {
+    const latestManifestTxId = await getLatestManifestFromAo();
+    if (!latestManifestTxId || latestManifestTxId === MANIFEST_TX_ID) {
+      throw manifestError;
+    }
+    return loadByTxId(latestManifestTxId);
+  }
 };
 
 const isObject = (value: unknown): value is Record<string, unknown> =>