fix(sidebar): order by created at (#1251)

Author: icecrasher321

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/control-bar/control-bar.tsx

@@ -1101,11 +1101,11 @@ export function ControlBar({ hasValidationErrors = false }: ControlBarProps) {
    * Get workflows in the exact order they appear in the sidebar
    */
   const getSidebarOrderedWorkflows = () => {
-    // Get and sort regular workflows by name alphabetically for stable ordering
+    // Get and sort regular workflows by creation date (newest first) for stable ordering
     const regularWorkflows = Object.values(workflows)
       .filter((workflow) => workflow.workspaceId === workspaceId)
       .filter((workflow) => workflow.marketplaceData?.status !== 'temp')
-      .sort((a, b) => a.name.localeCompare(b.name))
+      .sort((a, b) => b.createdAt.getTime() - a.createdAt.getTime())
 
     // Group workflows by folder
     const workflowsByFolder = regularWorkflows.reduce(

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/components/user-input/user-input.tsx

@@ -393,9 +393,11 @@ const UserInput = forwardRef<UserInputRef, UserInputProps>(
         const workspaceFiltered = items.filter(
           (w: any) => w.workspaceId === workspaceId || !w.workspaceId
         )
-        // Sort by name alphabetically for stable ordering, matching sidebar behavior
+        // Sort by creation date (newest first) for stable ordering, matching sidebar behavior
         const sorted = [...workspaceFiltered].sort((a: any, b: any) => {
-          return (a.name || 'Untitled Workflow').localeCompare(b.name || 'Untitled Workflow')
+          const dateA = a.createdAt ? new Date(a.createdAt).getTime() : 0
+          const dateB = b.createdAt ? new Date(b.createdAt).getTime() : 0
+          return dateB - dateA // Newest first for stable ordering
         })
         setWorkflows(
           sorted.map((w: any) => ({

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx

@@ -691,13 +691,13 @@ export function Sidebar() {
         }
       })
 
-      // Sort by name alphabetically for stable ordering
-      const sortByName = (a: WorkflowMetadata, b: WorkflowMetadata) => {
-        return a.name.localeCompare(b.name)
+      // Sort by creation date (newest first) for stable ordering
+      const sortByCreatedAt = (a: WorkflowMetadata, b: WorkflowMetadata) => {
+        return b.createdAt.getTime() - a.createdAt.getTime()
       }
 
-      regular.sort(sortByName)
-      temp.sort(sortByName)
+      regular.sort(sortByCreatedAt)
+      temp.sort(sortByCreatedAt)
     }
 
     return { regularWorkflows: regular, tempWorkflows: temp }

apps/sim/stores/workflows/registry/store.ts

@@ -109,6 +109,7 @@ async function fetchWorkflowsFromDB(workspaceId?: string): Promise<void> {
         description: description || '',
         color: color || '#3972F6',
         lastModified: createdAt ? new Date(createdAt) : new Date(),
+        createdAt: createdAt ? new Date(createdAt) : new Date(),
         marketplaceData: marketplaceData || null,
         workspaceId,
         folderId: folderId || null,
@@ -594,6 +595,7 @@ export const useWorkflowRegistry = create<WorkflowRegistry>()(
             id: serverWorkflowId,
             name: createdWorkflow.name,
             lastModified: new Date(),
+            createdAt: new Date(),
             description: createdWorkflow.description,
             color: createdWorkflow.color,
             marketplaceData: options.marketplaceId
@@ -836,6 +838,7 @@ export const useWorkflowRegistry = create<WorkflowRegistry>()(
           id,
           name: metadata.name || generateCreativeWorkflowName(),
           lastModified: new Date(),
+          createdAt: new Date(),
           description: metadata.description || 'Imported from marketplace',
           color: metadata.color || getNextWorkflowColor(),
           marketplaceData: { id: marketplaceId, status: 'temp' as const },
@@ -992,6 +995,7 @@ export const useWorkflowRegistry = create<WorkflowRegistry>()(
           id,
           name: `${sourceWorkflow.name} (Copy)`,
           lastModified: new Date(),
+          createdAt: new Date(),
           description: sourceWorkflow.description,
           color: getNextWorkflowColor(),
           workspaceId, // Include the workspaceId in the new workflow
@@ -1322,6 +1326,7 @@ export const useWorkflowRegistry = create<WorkflowRegistry>()(
               ...workflow,
               ...metadata,
               lastModified: new Date(),
+              createdAt: workflow.createdAt, // Preserve creation date
             },
           },
           error: null,
@@ -1354,6 +1359,9 @@ export const useWorkflowRegistry = create<WorkflowRegistry>()(
                 color: updatedWorkflow.color,
                 folderId: updatedWorkflow.folderId,
                 lastModified: new Date(updatedWorkflow.updatedAt),
+                createdAt: updatedWorkflow.createdAt
+                  ? new Date(updatedWorkflow.createdAt)
+                  : state.workflows[id].createdAt,
               },
             },
           }))

apps/sim/stores/workflows/registry/types.ts

@@ -14,6 +14,7 @@ export interface WorkflowMetadata {
   id: string
   name: string
   lastModified: Date
+  createdAt: Date
   description?: string
   color: string
   marketplaceData?: MarketplaceData | null