Blog Layout

"use client";

import { ArticleAdapter, PostAdapter, ArticleEntity, PostEntity } from "../lib/utils";
import { UniRender } from "@unilab/ukit";
import { URPC } from "@unilab/urpc";
import { useEffect, useState } from "react";
import { BlogLayout } from "../components/ui/blog-layout";

const Blog = () => {
  const [isInitialized, setIsInitialized] = useState(false);
  
  useEffect(() => {
    const initializeURPC = async () => {
      // Initialize URPC
      const MyPlugin = {
        entities: [PostEntity, ArticleEntity],
        adapters: [
          {
            source: "memory",
            entity: "PostEntity",
            adapter: new PostAdapter(),
          },
          {
            source: "memory",
            entity: "ArticleEntity",
            adapter: new ArticleAdapter(),
          },
        ],
      };
  
      URPC.init({
        plugins: [MyPlugin],
        entityConfigs: {
          post: {
            defaultSource: "memory",
          },
          article: {
            defaultSource: "memory",
          },
        },
      });
      console.log('(URPC as any).getGlobalInstance();', (URPC as any).getGlobalInstance())
      setIsInitialized(true);
    }
    if (!isInitialized) {
      initializeURPC();
    }
  }, [isInitialized]);

  if (!isInitialized) {
    return (
      <div className="flex items-center justify-center min-h-screen">
        <div className="text-center">
          <div className="animate-spin w-8 h-8 border-2 border-blue-600 border-t-transparent rounded-full mx-auto mb-4"></div>
          <p className="text-gray-600">Initializing URPC...</p>
        </div>
      </div>
    );
  }
  return (
      <UniRender
        entity={PostEntity}
        source="memory"
        layout="custom"
        render={BlogLayout}
        config={{
          title: { label: "Article Title" },
          content: { label: "Content" },
          author: { label: "Author" },
          category: { label: "Category" },
        }}
        pagination={{
          enabled: true,
          pageSize: 4,
        }}
      />
  );
};

export default Blog;