Merge branch 'AGE-914/implement-app-management-view' of https://githu…

…b.com/Agenta-AI/agenta into AGE-914/implement-app-management-view

agenta-web/src/components/AppSelector/AppSelector.tsx

@@ -22,6 +22,7 @@ import ResultComponent from "../ResultComponent/ResultComponent"
 import {dynamicContext} from "@/lib/helpers/dynamic"
 import AppTemplateCard from "./AppTemplateCard"
 import Image from "next/image"
+import dayjs from "dayjs"
 
 const useStyles = createUseStyles((theme: JSSTheme) => ({
     container: ({themeMode}: StyleProps) => ({
@@ -245,9 +246,16 @@ const AppSelector: React.FC = () => {
     }
 
     const filteredApps = useMemo(() => {
-        return searchTerm
-            ? apps.filter((app) => app.app_name.toLowerCase().includes(searchTerm.toLowerCase()))
-            : apps
+        let filtered = apps.sort(
+            (a, b) => dayjs(b.updated_at).valueOf() - dayjs(a.updated_at).valueOf(),
+        )
+
+        if (searchTerm) {
+            filtered = apps.filter((app) =>
+                app.app_name.toLowerCase().includes(searchTerm.toLowerCase()),
+            )
+        }
+        return filtered
     }, [apps, searchTerm])
 
     const steps = [

agenta-web/src/components/AppSelector/modals/EditAppModal.tsx

@@ -6,6 +6,7 @@ import {CheckOutlined} from "@ant-design/icons"
 import {Input, Modal, Typography} from "antd"
 import React, {useMemo, useState} from "react"
 import {createUseStyles} from "react-jss"
+import {useUpdateEffect} from "usehooks-ts"
 
 type EditAppModalProps = {
     appDetails: ListAppsItem
@@ -29,6 +30,10 @@ const EditAppModal = ({appDetails, ...props}: EditAppModalProps) => {
     const [appNameInput, setAppNameInput] = useState(appDetails.app_name)
     const [editAppLoading, setEditAppLoading] = useState(false)
 
+    useUpdateEffect(() => {
+        setAppNameInput(appDetails.app_name)
+    }, [apps])
+
     const appNameExist = useMemo(
         () =>
             apps.some(