create-bluecopa-react-app 1.0.20 → 1.0.22

package/templates/latest/app/routes/comments.tsx

@@ -1,12 +1,24 @@
-import React, { useState } from 'react';
+import React, { useState } from "react";
 import { AppSidebar } from "~/components/app-sidebar";
 import { SiteHeader } from "~/components/site-header";
 import { SidebarInset, SidebarProvider } from "~/components/ui/sidebar";
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "~/components/ui/card";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "~/components/ui/card";
 import { Button } from "~/components/ui/button";
 import { Input } from "~/components/ui/input";
 import { Label } from "~/components/ui/label";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "~/components/ui/select";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "~/components/ui/select";
 import { Badge } from "~/components/ui/badge";
 import { Separator } from "~/components/ui/separator";
 import { Avatar, AvatarFallback } from "~/components/ui/avatar";
@@ -21,15 +33,23 @@ import {
   useSubscribeUser,
   useUnsubscribeUser,
   useCheckSubscriptionStatus,
-  copaApi
-} from '@bluecopa/react';
-import { MessageSquare, Plus, Send, Edit, Trash2, Bell, BellOff, Users } from 'lucide-react';
+} from "@bluecopa/react";
+import {
+  MessageSquare,
+  Plus,
+  Send,
+  Edit,
+  Trash2,
+  Bell,
+  BellOff,
+  Users,
+} from "lucide-react";
 
 // Mock user data - in real app this would come from auth context
 const MOCK_USER = {
-  id: 'user-123',
-  name: 'John Doe',
-  email: 'john@example.com'
+  id: "user-123",
+  name: "John Doe",
+  email: "john@example.com",
 };
 
 // Component types for better organization
@@ -55,15 +75,15 @@ interface SubscriptionControlsProps {
 
 // Thread Creation Form Component
 function ThreadForm({ onThreadCreated }: ThreadFormProps) {
-  const [componentId, setComponentId] = useState('');
-  const [componentType, setComponentType] = useState<string>('');
+  const [componentId, setComponentId] = useState("");
+  const [componentType, setComponentType] = useState<string>("");
 
   const createThreadMutation = useCreateThread({
     onSuccess: (data) => {
-      toast.success('Thread created successfully!');
-      onThreadCreated(data.data.id || '');
-      setComponentId('');
-      setComponentType('');
+      toast.success("Thread created successfully!");
+      onThreadCreated(data.data.id || "");
+      setComponentId("");
+      setComponentType("");
     },
     onError: (error) => {
       toast.error(`Failed to create thread: ${error.message}`);
@@ -73,7 +93,7 @@ function ThreadForm({ onThreadCreated }: ThreadFormProps) {
   const handleSubmit = (e: React.FormEvent) => {
     e.preventDefault();
     if (!componentId || !componentType) {
-      toast.error('Please fill in all fields');
+      toast.error("Please fill in all fields");
       return;
     }
 
@@ -123,12 +143,12 @@ function ThreadForm({ onThreadCreated }: ThreadFormProps) {
               </SelectContent>
             </Select>
           </div>
-          <Button 
-            type="submit" 
+          <Button
+            type="submit"
             disabled={createThreadMutation.isPending}
             className="w-full"
           >
-            {createThreadMutation.isPending ? 'Creating...' : 'Create Thread'}
+            {createThreadMutation.isPending ? "Creating..." : "Create Thread"}
           </Button>
         </form>
       </CardContent>
@@ -138,12 +158,12 @@ function ThreadForm({ onThreadCreated }: ThreadFormProps) {
 
 // Comment Form Component
 function CommentForm({ threadId, onCommentPosted }: CommentFormProps) {
-  const [comment, setComment] = useState('');
+  const [comment, setComment] = useState("");
 
   const postCommentMutation = usePostComment({
     onSuccess: () => {
-      toast.success('Comment posted successfully!');
-      setComment('');
+      toast.success("Comment posted successfully!");
+      setComment("");
       onCommentPosted();
     },
     onError: (error) => {
@@ -154,7 +174,7 @@ function CommentForm({ threadId, onCommentPosted }: CommentFormProps) {
   const handleSubmit = (e: React.FormEvent) => {
     e.preventDefault();
     if (!comment.trim()) {
-      toast.error('Please enter a comment');
+      toast.error("Please enter a comment");
       return;
     }
 
@@ -162,7 +182,7 @@ function CommentForm({ threadId, onCommentPosted }: CommentFormProps) {
       data: {
         chatThreadId: threadId,
         comment: comment.trim(),
-        parentId: threadId
+        parentId: threadId,
       },
     });
   };
@@ -187,12 +207,12 @@ function CommentForm({ threadId, onCommentPosted }: CommentFormProps) {
               className="min-h-[80px]"
             />
           </div>
-          <Button 
-            type="submit" 
+          <Button
+            type="submit"
             disabled={postCommentMutation.isPending}
             className="w-full"
           >
-            {postCommentMutation.isPending ? 'Posting...' : 'Post Comment'}
+            {postCommentMutation.isPending ? "Posting..." : "Post Comment"}
           </Button>
         </form>
       </CardContent>
@@ -201,13 +221,17 @@ function CommentForm({ threadId, onCommentPosted }: CommentFormProps) {
 }
 
 // Individual Comment Component
-function CommentItem({ comment, onCommentUpdated, onCommentDeleted }: CommentItemProps) {
+function CommentItem({
+  comment,
+  onCommentUpdated,
+  onCommentDeleted,
+}: CommentItemProps) {
   const [isEditing, setIsEditing] = useState(false);
-  const [editText, setEditText] = useState(comment.comment || '');
+  const [editText, setEditText] = useState(comment.comment || "");
 
   const updateCommentMutation = useUpdateComment({
     onSuccess: () => {
-      toast.success('Comment updated successfully!');
+      toast.success("Comment updated successfully!");
       setIsEditing(false);
       onCommentUpdated();
     },
@@ -218,7 +242,7 @@ function CommentItem({ comment, onCommentUpdated, onCommentDeleted }: CommentIte
 
   const deleteCommentMutation = useDeleteComment({
     onSuccess: () => {
-      toast.success('Comment deleted successfully!');
+      toast.success("Comment deleted successfully!");
       onCommentDeleted();
     },
     onError: (error) => {
@@ -228,7 +252,7 @@ function CommentItem({ comment, onCommentUpdated, onCommentDeleted }: CommentIte
 
   const handleUpdate = () => {
     if (!editText.trim()) {
-      toast.error('Comment cannot be empty');
+      toast.error("Comment cannot be empty");
       return;
     }
 
@@ -242,7 +266,7 @@ function CommentItem({ comment, onCommentUpdated, onCommentDeleted }: CommentIte
   };
 
   const handleDelete = () => {
-    if (window.confirm('Are you sure you want to delete this comment?')) {
+    if (window.confirm("Are you sure you want to delete this comment?")) {
       deleteCommentMutation.mutate(comment.id);
     }
   };
@@ -253,13 +277,17 @@ function CommentItem({ comment, onCommentUpdated, onCommentDeleted }: CommentIte
         <div className="flex items-center gap-3">
           <Avatar className="h-8 w-8">
             <AvatarFallback>
-              {comment.createdBy?.charAt(0)?.toUpperCase() || 'U'}
+              {comment.createdBy?.charAt(0)?.toUpperCase() || "U"}
             </AvatarFallback>
           </Avatar>
           <div>
-            <p className="font-medium text-sm">{comment.createdBy || 'Unknown User'}</p>
+            <p className="font-medium text-sm">
+              {comment.createdBy || "Unknown User"}
+            </p>
             <p className="text-xs text-muted-foreground">
-              {comment.createdDate ? new Date(comment.createdDate).toLocaleString() : 'Just now'}
+              {comment.createdDate
+                ? new Date(comment.createdDate).toLocaleString()
+                : "Just now"}
             </p>
           </div>
         </div>
@@ -296,14 +324,14 @@ function CommentItem({ comment, onCommentUpdated, onCommentDeleted }: CommentIte
               onClick={handleUpdate}
               disabled={updateCommentMutation.isPending}
             >
-              {updateCommentMutation.isPending ? 'Saving...' : 'Save'}
+              {updateCommentMutation.isPending ? "Saving..." : "Save"}
             </Button>
             <Button
               size="sm"
               variant="outline"
               onClick={() => {
                 setIsEditing(false);
-                setEditText(comment.comment || '');
+                setEditText(comment.comment || "");
               }}
             >
               Cancel
@@ -319,11 +347,14 @@ function CommentItem({ comment, onCommentUpdated, onCommentDeleted }: CommentIte
 
 // Subscription Controls Component
 function SubscriptionControls({ userId, threadId }: SubscriptionControlsProps) {
-  const { data: subscriptionStatus, isLoading } = useCheckSubscriptionStatus(userId, threadId);
+  const { data: subscriptionStatus, isLoading } = useCheckSubscriptionStatus(
+    userId,
+    threadId
+  );
 
   const subscribeUserMutation = useSubscribeUser({
     onSuccess: () => {
-      toast.success('Successfully subscribed to thread!');
+      toast.success("Successfully subscribed to thread!");
     },
     onError: (error) => {
       toast.error(`Failed to subscribe: ${error.message}`);
@@ -332,7 +363,7 @@ function SubscriptionControls({ userId, threadId }: SubscriptionControlsProps) {
 
   const unsubscribeUserMutation = useUnsubscribeUser({
     onSuccess: () => {
-      toast.success('Successfully unsubscribed from thread!');
+      toast.success("Successfully unsubscribed from thread!");
     },
     onError: (error) => {
       toast.error(`Failed to unsubscribe: ${error.message}`);
@@ -363,7 +394,9 @@ function SubscriptionControls({ userId, threadId }: SubscriptionControlsProps) {
         variant={isSubscribed ? "outline" : "default"}
         size="sm"
         onClick={isSubscribed ? handleUnsubscribe : handleSubscribe}
-        disabled={subscribeUserMutation.isPending || unsubscribeUserMutation.isPending}
+        disabled={
+          subscribeUserMutation.isPending || unsubscribeUserMutation.isPending
+        }
       >
         {isSubscribed ? (
           <>
@@ -386,12 +419,12 @@ function SubscriptionControls({ userId, threadId }: SubscriptionControlsProps) {
 
 // Main Comments Page Component
 export default function CommentsPage() {
-  const [selectedThreadId, setSelectedThreadId] = useState<string>('');
+  const [selectedThreadId, setSelectedThreadId] = useState<string>("");
 
-  const { 
-    data: commentsData, 
-    isLoading: commentsLoading, 
-    refetch: refetchComments 
+  const {
+    data: commentsData,
+    isLoading: commentsLoading,
+    refetch: refetchComments,
   } = useGetCommentsByThreadId(selectedThreadId, {
     enabled: !!selectedThreadId,
   });
@@ -440,14 +473,14 @@ export default function CommentsPage() {
               {/* Left Column - Thread Creation */}
               <div className="space-y-6">
                 <ThreadForm onThreadCreated={handleThreadCreated} />
-                
+
                 {selectedThreadId && (
                   <>
-                    <CommentForm 
-                      threadId={selectedThreadId} 
-                      onCommentPosted={handleCommentAction} 
+                    <CommentForm
+                      threadId={selectedThreadId}
+                      onCommentPosted={handleCommentAction}
                     />
-                    
+
                     <Card>
                       <CardHeader>
                         <CardTitle className="flex items-center gap-2">
@@ -459,9 +492,9 @@ export default function CommentsPage() {
                         </CardDescription>
                       </CardHeader>
                       <CardContent>
-                        <SubscriptionControls 
-                          userId={MOCK_USER.id} 
-                          threadId={selectedThreadId} 
+                        <SubscriptionControls
+                          userId={MOCK_USER.id}
+                          threadId={selectedThreadId}
                         />
                       </CardContent>
                     </Card>
@@ -475,10 +508,9 @@ export default function CommentsPage() {
                   <CardHeader>
                     <CardTitle>Comments</CardTitle>
                     <CardDescription>
-                      {selectedThreadId 
+                      {selectedThreadId
                         ? `Comments for thread ${selectedThreadId.slice(0, 8)}...`
-                        : 'Create a thread to see comments'
-                      }
+                        : "Create a thread to see comments"}
                     </CardDescription>
                   </CardHeader>
                   <CardContent>
@@ -524,13 +556,17 @@ export default function CommentsPage() {
                   <CardContent className="space-y-2">
                     <div className="flex justify-between items-center">
                       <span className="text-sm">Thread Selected:</span>
-                      <Badge variant={selectedThreadId ? "default" : "secondary"}>
+                      <Badge
+                        variant={selectedThreadId ? "default" : "secondary"}
+                      >
                         {selectedThreadId ? "Yes" : "No"}
                       </Badge>
                     </div>
                     <div className="flex justify-between items-center">
                       <span className="text-sm">Comments Loading:</span>
-                      <Badge variant={commentsLoading ? "default" : "secondary"}>
+                      <Badge
+                        variant={commentsLoading ? "default" : "secondary"}
+                      >
                         {commentsLoading ? "Yes" : "No"}
                       </Badge>
                     </div>

package/templates/latest/app/routes.tsx

@@ -5,6 +5,7 @@ import Comments from "./routes/comments";
 import Websocket from "./routes/websocket";
 import Payments from "./routes/payments";
 import Statements from "./routes/statements";
+import ApiTest from "./routes/apitest";
 
 export default function RouteConfig() {
   return (
@@ -14,6 +15,7 @@ export default function RouteConfig() {
       <Route path="/websocket" element={<Websocket />} />
       <Route path="/payments" element={<Payments />} />
       <Route path="/statements" element={<Statements />} />
+      <Route path="/apitest" element={<ApiTest />} />
       <Route path="*" element={<Navigate to="/" replace />} />
     </Routes>
   );

package/templates/latest/dist/assets/{__federation_expose_App-CcOhEUCE.js → __federation_expose_App-rkiN5ftu.js}

@@ -1,4 +1,4 @@
-System.register(['./__federation_fn_import-CzfA7kmP.js', './client-uh-HfYnI.js'], (function (exports, module) {
+System.register(['./__federation_fn_import-CzfA7kmP.js', './client-CjZD2orr.js'], (function (exports, module) {
   'use strict';
   var importShared, clientExports, jsxRuntimeExports, MemoryRouter, BrowserRouter, App;
   return {