diff --git a/frontend/src/pages/Admin/Agents/SQLConnectorSelection/index.jsx b/frontend/src/pages/Admin/Agents/SQLConnectorSelection/index.jsx
index d7eaa23c159f49cce4d502d23182ea38ad5d5c45..846c5b96572588232e57e27d08f6d4c4613cd92e 100644
--- a/frontend/src/pages/Admin/Agents/SQLConnectorSelection/index.jsx
+++ b/frontend/src/pages/Admin/Agents/SQLConnectorSelection/index.jsx
@@ -1,21 +1,26 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import DBConnection from "./DBConnection";
 import { Plus, Database } from "@phosphor-icons/react";
 import NewSQLConnection from "./NewConnectionModal";
 import { useModal } from "@/hooks/useModal";
 import SQLAgentImage from "@/media/agents/sql-agent.png";
+import Admin from "@/models/admin";
 
 export default function AgentSQLConnectorSelection({
   skill,
-  settings,
+  settings, // unused.
   toggleSkill,
   enabled = false,
   setHasChanges,
 }) {
   const { isOpen, openModal, closeModal } = useModal();
-  const [connections, setConnections] = useState(
-    settings?.preferences?.agent_sql_connections || []
-  );
+  const [connections, setConnections] = useState([]);
+  useEffect(() => {
+    Admin.systemPreferencesByFields(["agent_sql_connections"])
+      .then((res) => setConnections(res?.settings?.agent_sql_connections ?? []))
+      .catch(() => setConnections([]));
+  }, []);
+
   return (
     <>
       <div className="p-2">
diff --git a/frontend/src/pages/Admin/Agents/WebSearchSelection/index.jsx b/frontend/src/pages/Admin/Agents/WebSearchSelection/index.jsx
index fd201fb90c798480c6e82359d9e139a527ca1bf7..345d3ef05e29cd2040054d600e2316baf8168ee0 100644
--- a/frontend/src/pages/Admin/Agents/WebSearchSelection/index.jsx
+++ b/frontend/src/pages/Admin/Agents/WebSearchSelection/index.jsx
@@ -1,4 +1,5 @@
 import React, { useEffect, useRef, useState } from "react";
+import Admin from "@/models/admin";
 import AnythingLLMIcon from "@/media/logo/anything-llm-icon.png";
 import GoogleSearchIcon from "./icons/google.png";
 import SearchApiIcon from "./icons/searchapi.png";
@@ -119,8 +120,12 @@ export default function AgentWebSearchSelection({
   }, [searchQuery, selectedProvider]);
 
   useEffect(() => {
-    setSelectedProvider(settings?.preferences?.agent_search_provider ?? "none");
-  }, [settings?.preferences?.agent_search_provider]);
+    Admin.systemPreferencesByFields(["agent_search_provider"])
+      .then((res) =>
+        setSelectedProvider(res?.settings?.agent_search_provider ?? "none")
+      )
+      .catch(() => setSelectedProvider("none"));
+  }, []);
 
   const selectedSearchProviderObject = SEARCH_PROVIDERS.find(
     (provider) => provider.value === selectedProvider