Python: Add Function Approval UI to DevUI (#1401)

* ensure function aproval is parsed correctly

* udpate ui, add deployment guide button, other debug panel fixes

* feat(devui): Implement lazy loading architecture with enhanced security and state management

Major architectural improvements to DevUI for better performance, security, and developer experience:

Performance & Architecture:
- Implement lazy loading for entity discovery - entities loaded on-demand instead of at startup
- Add hot reload capability for development workflow via new reload endpoint
- Reduce startup time and memory footprint by deferring module imports

Security Enhancements:
- Remove remote entity loading capabilities (POST /v1/entities/add, DELETE endpoints)
- DevUI now strictly local development tool - no remote code execution
- Add explicit security documentation and best practices in README

Frontend Improvements:
- Migrate to Zustand for centralized state management (replacing prop drilling)
- Add lightweight zero-dependency markdown renderer with code block copy support
- Improve gallery UX with setup instructions modal instead of direct URL loading
- Enhanced message UI with copy functionality and better token usage display

Testing & Quality:
- Expand test coverage for lazy loading, type detection, and cache invalidation
- Add comprehensive tests for new behaviors (+231 lines of test code)
- Improve type safety and documentation throughout

Breaking Changes:
- Remote entity loading via URLs is no longer supported
- Entities must be loaded from local filesystem only

* update ui issues, uupdate test descripion

python/packages/devui/frontend/src/components/layout/settings-modal.tsx

@@ -24,7 +24,7 @@ interface SettingsModalProps {
 type Tab = "about" | "settings";
 
 export function SettingsModal({ open, onOpenChange, onBackendUrlChange }: SettingsModalProps) {
-  const [activeTab, setActiveTab] = useState<Tab>("about");
+  const [activeTab, setActiveTab] = useState<Tab>("settings");
 
   // Get current backend URL from localStorage or default
   const defaultUrl = import.meta.env.VITE_API_BASE_URL || "http://localhost:8080";
@@ -73,19 +73,6 @@ export function SettingsModal({ open, onOpenChange, onBackendUrlChange }: Settin
 
         {/* Tabs */}
         <div className="flex border-b px-6">
-          <button
-            onClick={() => setActiveTab("about")}
-            className={`px-4 py-2 text-sm font-medium transition-colors relative ${
-              activeTab === "about"
-                ? "text-foreground"
-                : "text-muted-foreground hover:text-foreground"
-            }`}
-          >
-            About
-            {activeTab === "about" && (
-              <div className="absolute bottom-0 left-0 right-0 h-0.5 bg-primary" />
-            )}
-          </button>
           <button
             onClick={() => setActiveTab("settings")}
             className={`px-4 py-2 text-sm font-medium transition-colors relative ${
@@ -99,35 +86,23 @@ export function SettingsModal({ open, onOpenChange, onBackendUrlChange }: Settin
               <div className="absolute bottom-0 left-0 right-0 h-0.5 bg-primary" />
             )}
           </button>
+          <button
+            onClick={() => setActiveTab("about")}
+            className={`px-4 py-2 text-sm font-medium transition-colors relative ${
+              activeTab === "about"
+                ? "text-foreground"
+                : "text-muted-foreground hover:text-foreground"
+            }`}
+          >
+            About
+            {activeTab === "about" && (
+              <div className="absolute bottom-0 left-0 right-0 h-0.5 bg-primary" />
+            )}
+          </button>
         </div>
 
         {/* Tab Content */}
         <div className="px-6 pb-6 min-h-[240px]">
-          {activeTab === "about" && (
-            <div className="space-y-4 pt-4">
-              <p className="text-sm text-muted-foreground">
-                DevUI is a sample app for getting started with Agent Framework.
-              </p>
-
-              <div className="flex justify-center pt-2">
-                <Button
-                  variant="outline"
-                  size="sm"
-                  onClick={() =>
-                    window.open(
-                      "https://github.com/microsoft/agent-framework",
-                      "_blank"
-                    )
-                  }
-                  className="text-xs"
-                >
-                  <ExternalLink className="h-3 w-3 mr-1" />
-                  Learn More about Agent Framework
-                </Button>
-              </div>
-            </div>
-          )}
-
           {activeTab === "settings" && (
             <div className="space-y-6 pt-4">
               {/* Backend URL Setting */}
@@ -188,6 +163,31 @@ export function SettingsModal({ open, onOpenChange, onBackendUrlChange }: Settin
               </div>
             </div>
           )}
+
+          {activeTab === "about" && (
+            <div className="space-y-4 pt-4">
+              <p className="text-sm text-muted-foreground">
+                DevUI is a sample app for getting started with Agent Framework.
+              </p>
+
+              <div className="flex justify-center pt-2">
+                <Button
+                  variant="outline"
+                  size="sm"
+                  onClick={() =>
+                    window.open(
+                      "https://github.com/microsoft/agent-framework",
+                      "_blank"
+                    )
+                  }
+                  className="text-xs"
+                >
+                  <ExternalLink className="h-3 w-3 mr-1" />
+                  Learn More about Agent Framework
+                </Button>
+              </div>
+            </div>
+          )}
         </div>
       </DialogContent>
     </Dialog>