diff --git a/backend/src/agent.py b/backend/src/agent.py
index 0780c34..93fe6d2 100644
--- a/backend/src/agent.py
+++ b/backend/src/agent.py
@@ -36,15 +36,25 @@ class Agent:
 
         # should be in expert init?
         self.tools = []
+        self.remotes = []
         for resource in self.resources:
-            if resource.kind != 'tool': continue
-            if resource.value.get('type') == 'native' and 'name' in resource.value:
-                tool_cls = next((t for t in self.app.tool_classes if t.tool_name() == resource.value['name']), None)
-                if tool_cls:
-                    tool = tool_cls()
-                    spec = tool.get_spec().clone()
-                    spec.name = resource.key
-                    self.tools.append(spec)
+            if resource.kind == 'tool':
+                if resource.value.get('type') == 'native' and 'name' in resource.value:
+                    tool_cls = next((t for t in self.app.tool_classes if t.tool_name() == resource.value['name']), None)
+                    if tool_cls:
+                        tool = tool_cls()
+                        spec = tool.get_spec().clone()
+                        spec.name = resource.key
+                        self.tools.append(spec)
+            elif resource.kind == 'remote':
+                value = resource.value or {}
+                if isinstance(value, str):
+                    value = {'prefix': value}
+                self.remotes.append({
+                    'name': resource.key,
+                    'prefix': value.get('prefix'),
+                })
+
     
     def _set_basic_info(self, id, name, user_id):
         self.id = id
@@ -205,16 +215,21 @@ class Agent:
                 if r.kind == kind and (key is None or r.key == key)]
 
     def get_tools(self, run=None):
-        """Collect the tools available to this agent.
-
-        Returns the agent-configured tools (derived from its resources) plus
-        any remote tools referenced by the run input. When a run is given,
-        remote names in ``run.input['remotes']`` are resolved and appended.
-        """
-        tools = list(self.tools)
+        remotes = list(self.remotes)
         if run is not None and 'remotes' in run.input:
-            tools += self.app.getRemoteTools(self.user_id, run.input['remotes'])
-        return tools
+            remotes += list(run.input['remotes'])
+
+        tools = list(self.tools) + self.app.getRemoteTools(self.user_id, remotes)
+
+        # Dedupe by tool name (agent-configured vs run-input vs native collisions)
+        seen, result = set(), []
+        for tool in tools:
+            if tool.name in seen:
+                continue
+            seen.add(tool.name)
+            result.append(tool)
+
+        return result
 
 
 class DebugAgent(Agent):
diff --git a/backend/src/app_mixins/agent.py b/backend/src/app_mixins/agent.py
index 2f0867a..38df2fa 100644
--- a/backend/src/app_mixins/agent.py
+++ b/backend/src/app_mixins/agent.py
@@ -126,13 +126,21 @@ class AgentMixin:
 
     async def save_agent_resource(self, agent_id, kind, key, value):
         await db.AgentResource.update_or_create(
+            {'value': value},
             agent_id=agent_id,
             kind=kind,
             key=key,
-            value=value,
         )
         print(f"Saved agent resource: {agent_id} - {kind} - {key}")
 
+    async def delete_agent_resource(self, agent_id, kind, key):
+        await db.AgentResource.filter(
+            agent_id=agent_id,
+            kind=kind,
+            key=key,
+        ).delete()
+        print(f"Deleted agent resource: {agent_id} - {kind} - {key}")
+
     # --- Control & Actions ---
 
     async def get_agent_control(self, agent_id):
diff --git a/backend/src/inference.py b/backend/src/inference.py
index 8fe5ffc..76e9b5a 100644
--- a/backend/src/inference.py
+++ b/backend/src/inference.py
@@ -36,9 +36,9 @@ def format_tools(tools):
         if isinstance(t, dict):
             specs.append(t)
         elif isinstance(t, ToolSpec):
-            specs.append(t.format_openai())
+            specs.append(t.to_openai_dict())
         elif isinstance(t, Tool):
-            specs.append(t.get_spec().format_openai())
+            specs.append(t.get_spec().to_openai_dict())
     return specs
 
 def format_openai(messages):
diff --git a/backend/src/server/websocket.py b/backend/src/server/websocket.py
index 35e2182..49851c1 100644
--- a/backend/src/server/websocket.py
+++ b/backend/src/server/websocket.py
@@ -150,6 +150,10 @@ def register(server, app, auth_manager):
                     await app.save_agent_resource(await agent_id_from_body(), body['kind'], body['key'], body['value'])
                     await send({'message': "resource saved", 'nonce': nonce})
 
+                elif action == "delete-agent-resource":
+                    await app.delete_agent_resource(await agent_id_from_body(), body['kind'], body['key'])
+                    await send({'message': "resource deleted", 'nonce': nonce})
+
                 elif action == "get-agent-runs":
                     await send({
                         'runs': await app.get_agent_runs(agent_id=await agent_id_from_body(allow_none=True), user_id=user_id),
diff --git a/frontend/src/components/JsonEditor.vue b/frontend/src/components/JsonEditor.vue
index dc0edb5..344c117 100644
--- a/frontend/src/components/JsonEditor.vue
+++ b/frontend/src/components/JsonEditor.vue
@@ -1,5 +1,6 @@
 <script setup>
   import { ref, computed, watch } from 'vue'
+  import * as ui from '../ui'
 
   const props = defineProps({
     /** JSON schema object describing the input structure */
@@ -55,6 +56,17 @@
     };
   }
 
+  async function addField(field) {
+    let key = await ui.input("Enter new property name");
+    if (!key) return;
+
+    // Never mutate the field object in place.
+    currentValue.value = {
+      ...(currentValue.value || {}),
+      [key]: null
+    };
+  }
+
   const computedFields = computed(() => {
     let fields = [];
     let skip = {};
diff --git a/frontend/src/views/Agent.vue b/frontend/src/views/Agent.vue
index 3e6fa15..607e49b 100644
--- a/frontend/src/views/Agent.vue
+++ b/frontend/src/views/Agent.vue
@@ -10,6 +10,8 @@
   import * as backend from '../backend';
   import * as ui from '../ui';
 
+  import * as iconoir from '@iconoir/vue';
+
   const props = defineProps({
     id: {
       type: String,
@@ -32,8 +34,7 @@
   });
 
   // UI State
-  const addingTool = ref(null);
-  const addingResource = ref(null);
+  const targetResource = ref(null);
 
   // === State Management === //
 
@@ -92,8 +93,7 @@
 
     // Replace with a backend call
     backend.sendAction('get-agent-resources', {agentname}).then(res => {
-      tools.value = res.resources.filter(r => r.kind == 'tool');
-      resources.value = res.resources.filter(r => !['tool', 'config'].includes(r.kind));
+      resources.value = res.resources;
     });
   }
 
@@ -237,34 +237,66 @@
     });
   }
 
-  async function saveAddingTool() {
-    let resource = {
-      kind: 'tool',
-      key: addingTool.value.name,
-      value: JSON.parse(addingTool.value.value),
-    };
-    addingTool.value = null;
+  async function updateResourceKey () {
+    let newKey = await ui.input("Enter new resource key");
+    if (!newKey || newKey == targetResource.value.key) return;
 
-    let res = await backend.sendAction("save-agent-resource", {
+    // Guard collisions, backend won't
+    for (let r of resources.value) {
+      if (r.kind == targetResource.value.kind && r.key == newKey) {
+        ui.alert(`Conflict: ${targetResource.value.kind} '${newKey}'`);
+        return;
+      }
+    }
+
+    // Keys can't be updated directly, we move the resource
+    await backend.sendAction("delete-agent-resource", {
       agentId: agent.value.id,
-      ...resource
+      ...targetResource.value
+    });
+
+    targetResource.value.key = newKey;
+    await backend.sendAction("save-agent-resource", {
+      agentId: agent.value.id,
+      ...targetResource.value,
     });
-    tools.value.push(resource);
   }
 
-  async function saveAddingResource() {
-    let resource = {
-      kind: addingResource.value.kind,
-      key: addingResource.value.key,
-      value: JSON.parse(addingResource.value.value),
-    };
-    addingResource.value = null;
-
+  async function saveResource () {
     let res = await backend.sendAction("save-agent-resource", {
       agentId: agent.value.id,
-      ...resource
+      ...targetResource.value
     });
-    resources.value.push(resource);
+
+    ui.alert(`Saved ${targetResource.value.kind} '${targetResource.value.key}'`);
+
+    if (targetResource.value.isNew) {
+      delete targetResource.value.isNew;
+      resources.value.push(targetResource.value);
+    }
+  }
+
+  async function deleteResource () {
+    if (!await ui.confirm(`Delete ${targetResource.value.kind} '${targetResource.value.key}'?`)) return;
+
+    let res = await backend.sendAction("delete-agent-resource", {
+      agentId: agent.value.id,
+      ...targetResource.value
+    });
+
+    let index = resources.value.indexOf(targetResource.value);
+    if (index >= 0) resources.value.splice(index, 1);
+    targetResource.value = null;
+  }
+
+  async function createResource () {
+    let kind = await ui.input("Enter resource kind");
+    if (!kind) return ui.alert('Cancel new resource');
+
+    let key = await ui.input("Enter resource key");
+    if (!kind) return ui.alert('Cancel new resource');
+
+    targetResource.value = {kind, key, value: {}, isNew: true};
   }
 </script>
 
@@ -327,36 +359,31 @@
       <JsonEditor :schema="config.schema" v-model="config.object" />
       <button type="submit" @click="saveConfig()">Save</button>
     </section>
-    <section>
-      <h3>Tools</h3>
-      <div v-for="(resource, index) in tools">
-        <div class="label">{{ resource.key }}</div>
-        <pre>{{ JSON.stringify(resource.value, null, 2) }}</pre>
-      </div>
-      <section v-if="addingTool">
-        <input v-model="addingTool.name" placeholder="name"><br>
-        <textarea v-model="addingTool.value" placeholder="{}"></textarea>
-        <br>
-        <button @click="saveAddingTool()">Save</button>
-        <button @click="addingTool=null">Cancel</button>
-      </section>
-      <div v-else><button @click="addingTool={}">Add Tool</button></div>
-    </section>
     <section>
       <h3>Resources</h3>
-      <div v-for="resource in resources">
-        <div class="label">{{ resource.kind }}:{{ resource.key }}</div>
-        <pre>{{ JSON.stringify(resource.value, null, 2) }}</pre>
+      <div class="row">
+        <section class="resource-detail column" v-if="targetResource">
+          <div>
+            <span class="resource-type">{{ targetResource.kind }}</span>
+            {{ targetResource.key }}
+          </div>
+          <JsonEditor :schema="{type:'object'}" v-model="targetResource.value" />
+        </section>
+        <section class="resource-table">
+          <div class="resource-entry" v-for="resource in resources" @click="targetResource=resource">
+            <span class="label">{{ resource.kind }}</span> {{ resource.key }}
+          </div>
+        </section>
+      </div>
+      <div>
+        <template v-if="targetResource">
+          <button @click="updateResourceKey">Update Key</button>
+          <button @click="deleteResource">Delete</button>
+          <button @click="saveResource">Save</button>
+          <button @click="targetResource=null">Cancel</button>
+        </template>
+        <button v-else @click="createResource">Add Resource</button>
       </div>
-      <section v-if="addingResource">
-        <input v-model="addingResource.kind" placeholder="kind/domain"><br>
-        <input v-model="addingResource.key" placeholder="key"><br>
-        <textarea v-model="addingResource.value" placeholder="value"></textarea>
-        <br>
-        <button @click="saveAddingResource()">Save</button>
-        <button @click="addingResource=null">Cancel</button>
-      </section>
-      <div v-else><button @click="addingResource={}">Add Resource</button></div>
     </section>
   </main>
 </template>
@@ -398,4 +425,37 @@
     resize: vertical;
     height: 5em;
   }
+
+  .resource-table {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(6em, 1fr));
+    height: fit-content;
+    flex: 1;
+
+    /*align-items: center;
+    gap: 0.5rem;
+    padding: 0.5rem 0.75rem;
+    border-bottom: 1px solid var(--color-border);*/
+  }
+  .resource-entry {
+    border: 1px solid var(--color-border);
+    border-radius: var(--border-radius);
+    background-color: var(--color-surface-strong);
+    padding: .4rem .6rem;
+    width: max-content;
+  }
+  .resource-entry:hover {
+    border-color: var(--color-highlight);
+  }
+
+  .resource-type {
+    font-family: monospace;
+    border: 1px solid var(--color-border);
+    border-radius: 3px;
+    padding: .1rem .3rem;
+  }
+
+  /* style fix */
+  .row > section { margin-left: 0; }
+  .row > section:last-child { margin-right: 0; }
 </style>
\ No newline at end of file