fix: wip

Author: dillionverma

apps/www/app/(app)/blocks/page.tsx

@@ -0,0 +1,34 @@
+import Link from "next/link";
+
+import { BlockDisplay } from "@/components/block-display";
+import { Button } from "@/components/ui/button";
+
+export const dynamic = "force-static";
+export const revalidate = false;
+
+const FEATURED_BLOCKS = [
+  "footer-1",
+  "faq-3",
+  // "dashboard-01",
+  // "sidebar-07",
+  // "sidebar-03",
+  // "login-03",
+  // "login-04",
+];
+
+export default async function BlocksPage() {
+  return (
+    <div className="flex flex-col gap-12 md:gap-24">
+      {FEATURED_BLOCKS.map((name) => (
+        <BlockDisplay name={name} key={name} />
+      ))}
+      <div className="container-wrapper">
+        <div className="container flex justify-center py-6">
+          <Button asChild variant="outline">
+            <Link href="/blocks/sidebar">Browse more blocks</Link>
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+}

apps/www/app/(blog)/blog/page.tsx

@@ -30,8 +30,8 @@ export default async function Page({
   const selectedTag = params?.tag ?? "";
 
   const posts = blogSource.getPages().sort((a, b) => {
-    const dateA = new Date(a.data?.publishedOn || 0).getTime();
-    const dateB = new Date(b.data?.publishedOn || 0).getTime();
+    const dateA = new Date(a.data?.publishedOn).getTime();
+    const dateB = new Date(b.data?.publishedOn).getTime();
     return dateB - dateA;
   });
 

apps/www/components/block-display.tsx

@@ -0,0 +1,69 @@
+import * as React from "react";
+import { registryItemFileSchema } from "shadcn/schema";
+import { z } from "zod";
+
+import { BlockViewer } from "@/components/block-viewer";
+import { ComponentPreview } from "@/components/component-preview";
+import { highlightCode } from "@/lib/highlight-code";
+import {
+  createFileTreeForRegistryItemFiles,
+  getRegistryItem,
+} from "@/lib/registry";
+import { cn } from "@/lib/utils";
+
+export async function BlockDisplay({ name }: { name: string }) {
+  // const item = await getCachedRegistryItem(name);
+
+  // if (!item?.files) {
+  //   return null;
+  // }
+
+  // const [tree, highlightedFiles] = await Promise.all([
+  //   getCachedFileTree(item.files),
+  //   getCachedHighlightedFiles(item.files),
+  // ]);
+
+  return (
+    <BlockViewer
+      name={name}
+      // item={item}
+      // tree={tree}
+      // highlightedFiles={highlightedFiles}
+    >
+      <ComponentPreview
+        name={name}
+        // name={item.name}
+        hideCode
+        className={cn(
+          "my-0 **:[.preview]:h-auto **:[.preview]:p-4 **:[.preview>.p-6]:p-0",
+          // item.meta?.containerClassName,
+        )}
+      />
+    </BlockViewer>
+  );
+}
+
+const getCachedRegistryItem = React.cache(async (name: string) => {
+  return await getRegistryItem(name);
+});
+
+const getCachedFileTree = React.cache(
+  async (files: Array<{ path: string; target?: string }>) => {
+    if (!files) {
+      return null;
+    }
+
+    return await createFileTreeForRegistryItemFiles(files);
+  },
+);
+
+const getCachedHighlightedFiles = React.cache(
+  async (files: z.infer<typeof registryItemFileSchema>[]) => {
+    return await Promise.all(
+      files.map(async (file) => ({
+        ...file,
+        highlightedContent: await highlightCode(file.content ?? ""),
+      })),
+    );
+  },
+);