@flowerforce/flowerbase 1.6.3-beta.0 → 1.6.3-beta.2

package/dist/monitoring/plugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../../src/monitoring/plugin.ts"],"names":[],"mappings":"AAEA,OAAO,oBAAoB,CAAA;AAG3B,OAAO,KAAK,EAAE,eAAe,EAAgC,MAAM,SAAS,CAAA;AAslB5E,QAAA,MAAM,sBAAsB,QACrB,eAAe,SACd;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,kBAw5BH,CAAA;AAE1B,eAAe,sBAAsB,CAAA"}
+{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../../src/monitoring/plugin.ts"],"names":[],"mappings":"AAEA,OAAO,oBAAoB,CAAA;AAG3B,OAAO,KAAK,EAAE,eAAe,EAAgC,MAAM,SAAS,CAAA;AA6jB5E,QAAA,MAAM,sBAAsB,QACrB,eAAe,SACd;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,kBAg6BH,CAAA;AAE1B,eAAe,sBAAsB,CAAA"}

package/dist/monitoring/plugin.js

@@ -282,36 +282,8 @@ const buildRulesMeta = (meta) => {
     };
 };
 const buildCollectionRulesSnapshot = (rules, collection, user, runAsSystem) => {
-    var _a, _b;
     const collectionRules = rules === null || rules === void 0 ? void 0 : rules[collection];
-    if (!collectionRules) {
-        return {
-            collection,
-            rules: null,
-            filters: [],
-            matchedFilters: [],
-            roles: [],
-            matchedRoles: [],
-            runAsSystem: !!runAsSystem
-        };
-    }
-    const filters = (_a = collectionRules.filters) !== null && _a !== void 0 ? _a : [];
-    const roles = (_b = collectionRules.roles) !== null && _b !== void 0 ? _b : [];
-    const safeUser = (user !== null && user !== void 0 ? user : {});
-    const matchedFilters = (0, utils_1.getValidRule)({ filters, user: safeUser });
-    const matchedFilterNames = matchedFilters.map((filter) => filter.name);
-    const matchedRoles = roles
-        .filter((role) => (0, utils_2.checkApplyWhen)(role.apply_when, safeUser, null))
-        .map((role) => role.name);
-    return {
-        collection,
-        rules: sanitize(collectionRules),
-        filters: filters.map((filter) => filter.name),
-        matchedFilters: matchedFilterNames,
-        roles: roles.map((role) => role.name),
-        matchedRoles,
-        runAsSystem: !!runAsSystem
-    };
+    return collectionRules !== null && collectionRules !== void 0 ? collectionRules : null;
 };
 const resolveAssetCandidates = (filename, prefix) => {
     const rootDir = process.cwd();
@@ -410,11 +382,11 @@ const wrapServicesForMonitoring = (addEvent) => {
         api: 'api',
         aws: 'aws',
         auth: 'auth',
-        'mongodb-atlas': 'rules'
+        'mongodb-atlas': 'mongo'
     };
     const initMethodMap = {
         aws: new Set(['lambda', 's3']),
-        'mongodb-atlas': new Set(['db', 'collection'])
+        'mongodb-atlas': new Set(['db', 'collection', 'limit', 'skip', 'toArray'])
     };
     const cache = new WeakMap();
     const wrapValue = (value, path, serviceName, meta) => {
@@ -854,6 +826,10 @@ const createMonitoringPlugin = (0, fastify_plugin_1.default)((app_1, ...args_1)
         });
         return { items };
     }));
+    app.get(`${prefix}/api/triggers`, () => __awaiter(void 0, void 0, void 0, function* () {
+        const triggersList = state_1.StateManager.select('triggers');
+        return { items: triggersList || [] };
+    }));
     app.get(`${prefix}/api/functions/:name`, (req, reply) => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
         if (!allowEdit) {
@@ -926,12 +902,15 @@ const createMonitoringPlugin = (0, fastify_plugin_1.default)((app_1, ...args_1)
                         : undefined)
             }
             : undefined;
+        const codeModified = typeof overrideCode === 'string' && overrideCode !== currentFunction.code;
         addFunctionHistory({
             ts: Date.now(),
             name,
             args: safeArgs,
             runAsSystem: effectiveRunAsSystem,
-            user: userInfo
+            user: userInfo,
+            code: codeModified ? overrideCode : undefined,
+            codeModified
         });
         addEvent({
             id: createEventId(),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flowerforce/flowerbase",
-  "version": "1.6.3-beta.0",
+  "version": "1.6.3-beta.2",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/monitoring/plugin.ts

@@ -31,6 +31,8 @@ type FunctionHistoryItem = {
   args: unknown[]
   runAsSystem: boolean
   user?: { id?: string; email?: string }
+  code?: string
+  codeModified?: boolean
 }
 
 type CollectionHistoryItem = {
@@ -339,34 +341,7 @@ const buildCollectionRulesSnapshot = (
   runAsSystem?: boolean
 ) => {
   const collectionRules = rules?.[collection]
-  if (!collectionRules) {
-    return {
-      collection,
-      rules: null,
-      filters: [],
-      matchedFilters: [],
-      roles: [],
-      matchedRoles: [],
-      runAsSystem: !!runAsSystem
-    }
-  }
-  const filters = collectionRules.filters ?? []
-  const roles = collectionRules.roles ?? []
-  const safeUser = (user ?? {}) as Parameters<typeof getValidRule>[0]['user']
-  const matchedFilters = getValidRule({ filters, user: safeUser })
-  const matchedFilterNames = matchedFilters.map((filter) => filter.name)
-  const matchedRoles = roles
-    .filter((role) => checkApplyWhen(role.apply_when, safeUser as never, null))
-    .map((role) => role.name)
-  return {
-    collection,
-    rules: sanitize(collectionRules),
-    filters: filters.map((filter) => filter.name),
-    matchedFilters: matchedFilterNames,
-    roles: roles.map((role) => role.name),
-    matchedRoles,
-    runAsSystem: !!runAsSystem
-  }
+  return collectionRules ?? null
 }
 
 const resolveAssetCandidates = (filename: string, prefix: string) => {
@@ -490,11 +465,11 @@ const wrapServicesForMonitoring = (addEvent: (event: MonitorEvent) => void) => {
     api: 'api',
     aws: 'aws',
     auth: 'auth',
-    'mongodb-atlas': 'rules'
+    'mongodb-atlas': 'mongo'
   }
   const initMethodMap: Record<string, Set<string>> = {
     aws: new Set(['lambda', 's3']),
-    'mongodb-atlas': new Set(['db', 'collection'])
+    'mongodb-atlas': new Set(['db', 'collection', 'limit', 'skip', 'toArray'])
   }
 
   const cache = new WeakMap<object, unknown>()
@@ -972,6 +947,11 @@ const createMonitoringPlugin = fp(async (
     return { items }
   })
 
+  app.get(`${prefix}/api/triggers`, async () => {
+    const triggersList = StateManager.select('triggers') as { fileName: string; content: unknown }[] | undefined
+    return { items: triggersList || [] }
+  })
+
   app.get(`${prefix}/api/functions/:name`, async (req, reply) => {
     if (!allowEdit) {
       reply.code(403)
@@ -1059,12 +1039,15 @@ const createMonitoringPlugin = fp(async (
             : undefined)
       }
       : undefined
+    const codeModified = typeof overrideCode === 'string' && overrideCode !== currentFunction.code
     addFunctionHistory({
       ts: Date.now(),
       name,
       args: safeArgs,
       runAsSystem: effectiveRunAsSystem,
-      user: userInfo
+      user: userInfo,
+      code: codeModified ? overrideCode : undefined,
+      codeModified
     })
 
     addEvent({

package/src/monitoring/ui.css

@@ -173,6 +173,10 @@ main {
   grid-template-columns: minmax(220px, 30%) minmax(0, 1fr);
 }
 
+.triggers-grid {
+  grid-template-columns: minmax(220px, 30%) minmax(0, 1fr);
+}
+
 .collections-grid {
   grid-template-columns: minmax(220px, 30%) minmax(0, 1fr);
 }
@@ -276,6 +280,12 @@ button {
   cursor: pointer;
 }
 
+button:disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+  filter: grayscale(0.2);
+}
+
 button.secondary {
   color: var(--muted);
   border-color: var(--border);
@@ -301,7 +311,7 @@ button.danger {
 
 .event-row {
   display: grid;
-  grid-template-columns: 86px 90px 1fr;
+  grid-template-columns: 86px 90px 160px 1fr;
   gap: 8px;
   padding: 4px 6px;
   border-bottom: 1px dashed rgba(26, 47, 34, 0.6);
@@ -328,6 +338,22 @@ button.danger {
   color: var(--warn);
 }
 
+.event-user {
+  color: var(--muted);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.event-user.is-link {
+  color: var(--accent);
+  cursor: pointer;
+}
+
+.event-user.is-link:hover {
+  text-decoration: underline;
+}
+
 .event-detail {
   margin-top: 10px;
   background: var(--panel);
@@ -416,6 +442,26 @@ button.small {
   background: rgba(49, 233, 129, 0.08);
 }
 
+.history-modified {
+  color: var(--warn);
+  text-transform: uppercase;
+  letter-spacing: 0.6px;
+  font-size: 10px;
+}
+
+.modified-pill {
+  display: inline-flex;
+  align-items: center;
+  padding: 1px 6px;
+  border-radius: 999px;
+  font-size: 10px;
+  text-transform: uppercase;
+  letter-spacing: 0.6px;
+  color: var(--warn);
+  border: 1px solid rgba(255, 176, 64, 0.5);
+  background: rgba(255, 176, 64, 0.12);
+}
+
 .history-meta {
   display: flex;
   flex-direction: column;
@@ -462,6 +508,10 @@ button.small {
   border-color: rgba(49, 233, 129, 0.45);
 }
 
+.user-row.disabled {
+  opacity: 0.55;
+}
+
 .user-row:hover {
   background: rgba(49, 233, 129, 0.08);
 }
@@ -500,6 +550,16 @@ button.small {
   cursor: pointer;
 }
 
+.trigger-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  padding: 6px;
+  border-bottom: 1px dashed rgba(26, 47, 34, 0.6);
+  cursor: pointer;
+}
+
 .function-row.active {
   background: rgba(49, 233, 129, 0.12);
   border-color: rgba(49, 233, 129, 0.35);
@@ -509,6 +569,24 @@ button.small {
   background: rgba(49, 233, 129, 0.08);
 }
 
+.trigger-row.active {
+  background: rgba(49, 233, 129, 0.12);
+  border-color: rgba(49, 233, 129, 0.35);
+}
+
+.trigger-row:hover {
+  background: rgba(49, 233, 129, 0.08);
+}
+
+.trigger-link {
+  color: var(--accent);
+  cursor: pointer;
+}
+
+.trigger-link:hover {
+  text-decoration: underline;
+}
+
 .user-meta {
   display: flex;
   flex-direction: column;
@@ -549,6 +627,26 @@ button.small {
   min-height: 0;
 }
 
+.collection-actions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+  margin-top: 20px;
+}
+
+.collection-actions .editor-actions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 12px;
+}
+
+.collection-actions .result-toolbar {
+  margin-left: auto;
+}
+
 .mini-tabs {
   display: flex;
   gap: 8px;
@@ -597,22 +695,46 @@ button.small {
   min-height: 0;
 }
 
-.collection-controls {
+.collection-layout {
   display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
+  grid-template-columns: minmax(200px, 30%) minmax(0, 70%);
+  gap: 12px;
+  align-items: start;
+}
+
+.collection-controls {
+  display: flex;
+  flex-direction: column;
   gap: 10px;
-  align-items: end;
 }
 
 .collection-io {
   display: grid;
-  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+  grid-template-columns: minmax(0, 1fr);
   gap: 12px;
   align-items: stretch;
 }
 
+.collection-io[data-mode="query"] [data-collection-mode="aggregate"] {
+  display: none;
+}
+
+.collection-io[data-mode="aggregate"] [data-collection-mode="query"] {
+  display: none;
+}
+
+.collection-io {
+  height: 100%;
+}
+
 .collection-io textarea {
   min-height: 140px;
+  height: 100%;
+}
+
+.collection-io .json-editor {
+  height: 100%;
+  min-height: 100%;
 }
 
 .json-editor {
@@ -977,7 +1099,7 @@ button.small {
     grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
   }
 
-  .collection-controls {
+  .collection-layout {
     grid-template-columns: minmax(0, 1fr);
   }
-}
+}

package/src/monitoring/ui.html

@@ -26,6 +26,7 @@
       <button class="tab-button active" data-tab="events">events</button>
       <button class="tab-button" data-tab="users">users</button>
       <button class="tab-button" data-tab="functions">functions</button>
+      <button class="tab-button" data-tab="triggers">triggers</button>
       <button class="tab-button" data-tab="collections">collections</button>
     </div>
     <div class="tab-panels">
@@ -46,7 +47,7 @@
                 <option value="http_endpoint">http_endpoint</option>
                 <option value="api">api</option>
                 <option value="aws">aws</option>
-                <option value="rules">rules</option>
+                <option value="mongo">mongo</option>
                 <option value="log">log</option>
                 <option value="error">error</option>
               </select>
@@ -73,7 +74,7 @@
         <div class="controls">
           <input id="userSearch" class="wide-input" type="text" placeholder="search users (email, id, status)" />
         </div>
-        <div class="split-grid users-grid">
+        <div class="split-grid users-grid functions-grid">
           <div class="column-stack">
             <div class="subpanel list-panel">
               <div class="subpanel-title">users</div>
@@ -166,7 +167,6 @@
                   <button id="restoreFunction" class="secondary">restore original</button>
                   <button id="invokeFunction">invoke</button>
                 </div>
-                <div class="hint" id="functionEditorStatus"></div>
               </div>
               <div class="function-io">
                 <div class="io-column">
@@ -182,6 +182,29 @@
           </div>
         </div>
       </section>
+      <section class="panel tab-panel" data-panel="triggers">
+        <div class="panel-header">
+          <span>Triggers</span>
+          <button id="refreshTriggers" class="secondary">refresh</button>
+        </div>
+          <div class="split-grid triggers-grid">
+            <div class="column-stack">
+              <div class="subpanel list-panel">
+                <div class="subpanel-title">triggers</div>
+                <div id="triggerList" class="user-list"></div>
+              </div>
+            </div>
+            <div class="subpanel detail-panel">
+              <div class="detail-header">
+                <div class="subpanel-title">trigger detail</div>
+                <button id="triggerFunctionButton" type="button" class="secondary small is-hidden">
+                  go to function
+                </button>
+              </div>
+              <pre id="triggerDetail" class="event-detail">select a trigger to inspect</pre>
+            </div>
+          </div>
+        </section>
       <section class="panel tab-panel" data-panel="collections">
         <div class="panel-header">
           <span>Collections</span>
@@ -213,61 +236,65 @@
               </div>
               <div class="mini-panels">
                 <div class="mini-panel active" data-collection-panel="query">
-                  <div class="collection-controls">
-                    <div class="control-group">
-                      <label for="collectionUserInput">user</label>
-                      <input id="collectionUserInput" list="collectionUserList" placeholder="select user" />
-                      <datalist id="collectionUserList"></datalist>
-                    </div>
-                    <div class="control-group">
-                      <label for="collectionRunMode">run as</label>
-                      <select id="collectionRunMode">
-                        <option value="system" selected>system</option>
-                        <option value="user">user</option>
-                      </select>
-                    </div>
-                    <div class="control-group">
-                      <label for="collectionMode">mode</label>
-                      <select id="collectionMode">
-                        <option value="query" selected>query</option>
-                        <option value="aggregate">aggregate</option>
-                      </select>
-                    </div>
-                    <div class="control-group">
-                      <label for="collectionSort">sort</label>
-                      <input id="collectionSort" type="text" placeholder='{"createdAt": -1}' />
-                    </div>
-                  </div>
-                <div class="collection-io">
-                  <div class="io-column">
-                    <label for="collectionQuery">query</label>
-                    <div class="json-editor">
-                      <pre id="collectionQueryHighlight" class="json-highlight"></pre>
-                      <textarea id="collectionQuery" placeholder='{"field": "value"}'></textarea>
+                  <div class="collection-layout">
+                    <div class="collection-controls">
+                      <div class="control-group">
+                        <label for="collectionUserInput">user</label>
+                        <input id="collectionUserInput" list="collectionUserList" placeholder="select user" />
+                        <datalist id="collectionUserList"></datalist>
+                      </div>
+                      <div class="control-group">
+                        <label for="collectionRunMode">run as</label>
+                        <select id="collectionRunMode">
+                          <option value="system" selected>system</option>
+                          <option value="user">user</option>
+                        </select>
+                      </div>
+                      <div class="control-group">
+                        <label for="collectionMode">mode</label>
+                        <select id="collectionMode">
+                          <option value="query" selected>query</option>
+                          <option value="aggregate">aggregate</option>
+                        </select>
+                      </div>
+                      <div class="control-group">
+                        <label for="collectionSort">sort</label>
+                        <input id="collectionSort" type="text" placeholder='{"createdAt": -1}' />
+                      </div>
                     </div>
-                  </div>
-                  <div class="io-column">
-                    <label for="collectionAggregate">aggregate</label>
-                    <div class="json-editor">
-                      <pre id="collectionAggregateHighlight" class="json-highlight"></pre>
-                      <textarea id="collectionAggregate" placeholder='[{ "$match": { "field": "value" } }]'></textarea>
+                    <div id="collectionIo" class="collection-io" data-mode="query">
+                      <div class="io-column" data-collection-mode="query">
+                        <label for="collectionQuery">query</label>
+                        <div class="json-editor">
+                          <pre id="collectionQueryHighlight" class="json-highlight"></pre>
+                          <textarea id="collectionQuery" placeholder='{"field": "value"}'></textarea>
+                        </div>
+                      </div>
+                      <div class="io-column" data-collection-mode="aggregate">
+                        <label for="collectionAggregate">aggregate</label>
+                        <div class="json-editor">
+                          <pre id="collectionAggregateHighlight" class="json-highlight"></pre>
+                          <textarea id="collectionAggregate" placeholder='[{ "$match": { "field": "value" } }]'></textarea>
+                        </div>
+                      </div>
                     </div>
                   </div>
-                </div>
-                  <div class="editor-actions">
-                    <button id="runCollectionQuery">run</button>
-                    <div class="pager">
-                      <div class="pager-controls">
-                        <button id="collectionPrev" class="secondary">prev</button>
-                        <button id="collectionNext" class="secondary">next</button>
+                  <div class="collection-actions">
+                    <div class="editor-actions">
+                      <button id="runCollectionQuery">run</button>
+                      <div class="pager">
+                        <div class="pager-controls">
+                          <button id="collectionPrev" class="secondary">prev</button>
+                          <button id="collectionNext" class="secondary">next</button>
+                        </div>
+                        <div>page <span id="collectionPage">1</span>/<span id="collectionPages">1</span> · total <span id="collectionTotal">0</span></div>
                       </div>
-                      <div>page <span id="collectionPage">1</span> · total <span id="collectionTotal">0</span></div>
                     </div>
-                  </div>
-                  <div class="result-toolbar">
-                    <div class="toggle-buttons">
-                      <button id="collectionViewJson" class="secondary active">json</button>
-                      <button id="collectionViewTable" class="secondary">table</button>
+                    <div class="result-toolbar">
+                      <div class="toggle-buttons">
+                        <button id="collectionViewJson" class="secondary active">json</button>
+                        <button id="collectionViewTable" class="secondary">table</button>
+                      </div>
                     </div>
                   </div>
                   <div id="collectionResult" class="event-detail function-result"></div>

package/src/monitoring/ui.js

@@ -19,6 +19,9 @@
     functionUserMap: {},
     functionUserQuery: '',
     __functionUserTimer: null,
+    triggers: [],
+    selectedTrigger: null,
+    triggerFunctionMap: {},
     collections: [],
     selectedCollection: null,
     collectionSearch: '',
@@ -28,6 +31,9 @@
     collectionPage: 1,
     collectionHasMore: false,
     collectionTotal: 0,
+    collectionPageSize: 50,
+    collectionLoading: false,
+    collectionTotalsLoading: false,
     collectionResultView: 'json',
     collectionResultPayload: null,
     collectionResultHighlight: false,
@@ -74,18 +80,22 @@
   const functionHighlight = document.getElementById('functionHighlight');
   const functionGutter = document.getElementById('functionGutter');
   const restoreFunction = document.getElementById('restoreFunction');
-  const functionEditorStatus = document.getElementById('functionEditorStatus');
   const functionArgs = document.getElementById('functionArgs');
   const invokeFunction = document.getElementById('invokeFunction');
   const functionResult = document.getElementById('functionResult');
   const refreshFunctions = document.getElementById('refreshFunctions');
+  const refreshTriggers = document.getElementById('refreshTriggers');
   const functionHistory = document.getElementById('functionHistory');
+  const triggerList = document.getElementById('triggerList');
+  const triggerDetail = document.getElementById('triggerDetail');
+  const triggerFunctionButton = document.getElementById('triggerFunctionButton');
   const refreshCollections = document.getElementById('refreshCollections');
   const collectionSearch = document.getElementById('collectionSearch');
   const collectionList = document.getElementById('collectionList');
   const collectionHistory = document.getElementById('collectionHistory');
   const collectionRules = document.getElementById('collectionRules');
   const collectionSelected = document.getElementById('collectionSelected');
+  const collectionIo = document.getElementById('collectionIo');
   const collectionUserInput = document.getElementById('collectionUserInput');
   const collectionUserList = document.getElementById('collectionUserList');
   const collectionRunMode = document.getElementById('collectionRunMode');
@@ -100,6 +110,7 @@
   const collectionPrev = document.getElementById('collectionPrev');
   const collectionNext = document.getElementById('collectionNext');
   const collectionPage = document.getElementById('collectionPage');
+  const collectionPages = document.getElementById('collectionPages');
   const collectionTotal = document.getElementById('collectionTotal');
   const collectionViewJson = document.getElementById('collectionViewJson');
   const collectionViewTable = document.getElementById('collectionViewTable');
@@ -172,9 +183,26 @@
   };
 
   const updateCollectionPager = () => {
+    if (state.collectionLoading) {
+      if (collectionPage) collectionPage.textContent = '...';
+      if (state.collectionTotalsLoading) {
+        if (collectionPages) collectionPages.textContent = '...';
+        if (collectionTotal) collectionTotal.textContent = '...';
+      }
+      if (collectionPrev) collectionPrev.disabled = true;
+      if (collectionNext) collectionNext.disabled = true;
+      if (state.collectionTotalsLoading) return;
+    }
     if (collectionPage) {
       collectionPage.textContent = String(state.collectionPage || 1);
     }
+    const totalPages = Math.max(
+      1,
+      Math.ceil((state.collectionTotal || 0) / Math.max(state.collectionPageSize || 1, 1))
+    );
+    if (collectionPages) {
+      collectionPages.textContent = String(totalPages);
+    }
     if (collectionTotal) {
       collectionTotal.textContent = String(state.collectionTotal || 0);
     }
@@ -503,6 +531,40 @@
     return time + '  ' + type.padEnd(12, ' ') + '  ' + msg;
   };
 
+  const getEventUserId = (event) => {
+    if (!event || typeof event !== 'object') return '';
+    if (typeof event.userId === 'string') return event.userId;
+    if (event.user && typeof event.user === 'object') {
+      if (typeof event.user.id === 'string') return event.user.id;
+      if (typeof event.user._id === 'string') return event.user._id;
+      if (typeof event.user.userId === 'string') return event.user.userId;
+    }
+    const data = event.data;
+    if (!data || typeof data !== 'object') return '';
+    if (typeof data.userId === 'string') return data.userId;
+    if (typeof data.user_id === 'string') return data.user_id;
+    if (data.user && typeof data.user === 'object') {
+      if (typeof data.user.id === 'string') return data.user.id;
+      if (typeof data.user._id === 'string') return data.user._id;
+      if (typeof data.user.userId === 'string') return data.user.userId;
+    }
+    if (data.user_data && typeof data.user_data === 'object') {
+      if (typeof data.user_data.id === 'string') return data.user_data.id;
+      if (typeof data.user_data._id === 'string') return data.user_data._id;
+    }
+    return '';
+  };
+
+  const goToUser = (userId) => {
+    if (!userId || !userSearch) return;
+    state.selectedUserId = String(userId);
+    state.userQuery = state.selectedUserId;
+    state.customPage = 1;
+    userSearch.value = state.userQuery;
+    setActiveTab('users');
+    loadUsers();
+  };
+
   const getFunctionEventData = (event) => {
     if (!event || !event.type || event.type !== 'function') return null;
     const data = event.data || {};
@@ -542,16 +604,28 @@
       if (type && event.type !== type) return false;
       return matchesQuery(event, query);
     });
-    const recent = filtered.slice(-350);
+    const recent = filtered.slice(-350).reverse();
     eventsList.innerHTML = '';
     recent.forEach((event) => {
+      const userId = getEventUserId(event);
       const row = document.createElement('div');
       row.className = 'event-row';
       row.dataset.id = event.id;
       const typeClass = event.type === 'error' ? 'error' : (event.type === 'warn' ? 'warn' : '');
       row.innerHTML = '<div>' + formatTime(event.ts) + '</div>' +
         '<div class="event-type ' + typeClass + '">' + (event.type || '-') + '</div>' +
+        '<div class="event-user" title="' + (userId || '-') + '">' + (userId || '-') + '</div>' +
         '<div>' + (event.message || '') + '</div>';
+      if (userId) {
+        const userCell = row.querySelector('.event-user');
+        if (userCell) {
+          userCell.classList.add('is-link');
+          userCell.addEventListener('click', (clickEvent) => {
+            clickEvent.stopPropagation();
+            goToUser(userId);
+          });
+        }
+      }
       row.addEventListener('click', () => showDetail(event));
       eventsList.appendChild(row);
     });
@@ -560,7 +634,9 @@
   const showDetail = (event) => {
     state.selectedId = event.id;
     state.selectedEvent = event;
-    eventDetail.textContent = JSON.stringify(event, null, 2);
+    const text = JSON.stringify(event, null, 2) || '';
+    eventDetail.classList.add('json-highlight');
+    eventDetail.innerHTML = highlightJson(text);
     const functionData = getFunctionEventData(event);
     if (functionData && eventFunctionButton) {
       eventFunctionButton.classList.remove('is-hidden');
@@ -694,7 +770,10 @@
       const hint = createdLabel ? status + ' · ' + createdLabel : status;
       const hasAuth = !!(auth && auth._id);
       const row = document.createElement('div');
-      row.className = 'user-row' + (state.selectedUserId === userId ? ' active' : '');
+      const isDisabled = auth && auth.status === 'disabled';
+      row.className = 'user-row' +
+        (state.selectedUserId === userId ? ' active' : '') +
+        (isDisabled ? ' disabled' : '');
       row.dataset.id = userId;
       row.innerHTML = '<div class="user-meta">' +
         '<div class="code">' + primaryEmail + '</div>' +
@@ -754,12 +833,112 @@
       row.dataset.name = fn.name;
       const runMode = fn.run_as_system ? 'system' : 'user';
       const visibility = fn.private ? 'private' : 'public';
+      const triggerName = state.triggerFunctionMap ? state.triggerFunctionMap[fn.name] : null;
+      const metaParts = [visibility, runMode];
+      const triggerTag = triggerName
+        ? ' · <span class="trigger-link" data-trigger="' + escapeHtml(triggerName) + '">isTrigger</span>'
+        : '';
       row.innerHTML = '<div class="code">' + fn.name + '</div>' +
-        '<div class="hint">' + visibility + ' · ' + runMode + '</div>';
+        '<div class="hint">' + metaParts.join(' · ') + triggerTag + '</div>';
       functionList.appendChild(row);
     });
   };
 
+  const buildTriggerFunctionMap = (items) => {
+    const map = {};
+    (items || []).forEach((entry) => {
+      const content = entry && entry.content ? entry.content : null;
+      const handler = content && content.event_processors ? content.event_processors.FUNCTION : null;
+      const fnName = handler && handler.config ? handler.config.function_name : null;
+      const triggerName = (content && content.name) || entry.fileName || 'trigger';
+      if (typeof fnName === 'string' && fnName) {
+        map[fnName] = triggerName;
+      }
+    });
+    state.triggerFunctionMap = map;
+  };
+
+  const renderTriggers = (items) => {
+    if (!triggerList) return;
+    triggerList.innerHTML = '';
+    if (!items || !items.length) {
+      const empty = document.createElement('div');
+      empty.className = 'history-empty';
+      empty.textContent = 'no triggers yet';
+      triggerList.appendChild(empty);
+      return;
+    }
+    items.forEach((entry) => {
+      const content = entry && entry.content ? entry.content : null;
+      const name = (content && content.name) || entry.fileName || 'trigger';
+      const type = content && content.type ? content.type : 'unknown';
+      const handler = content && content.event_processors ? content.event_processors.FUNCTION : null;
+      const fnName = handler && handler.config ? handler.config.function_name : null;
+      const hint = fnName ? (type + ' · ' + fnName) : type;
+      const row = document.createElement('div');
+      row.className = 'trigger-row' + (state.selectedTrigger === entry ? ' active' : '');
+      row.dataset.name = name;
+      row.innerHTML = '<div class="code">' + name + '</div>' +
+        '<div class="hint">' + hint + '</div>';
+      triggerList.appendChild(row);
+    });
+  };
+
+  const showTriggerDetail = (entry) => {
+    state.selectedTrigger = entry;
+    const content = entry && entry.content ? entry.content : null;
+    const handler = content && content.event_processors ? content.event_processors.FUNCTION : null;
+    const fnName = handler && handler.config ? handler.config.function_name : null;
+    if (triggerList) {
+      triggerList.querySelectorAll('.trigger-row').forEach((row) => {
+        const name = row.dataset.name;
+        const currentName = (content && content.name) || entry.fileName || 'trigger';
+        row.classList.toggle('active', name === currentName);
+      });
+    }
+    if (triggerDetail) {
+      triggerDetail.classList.add('json-highlight');
+      triggerDetail.innerHTML = highlightJson(JSON.stringify(entry, null, 2) || '');
+    }
+    if (triggerFunctionButton) {
+      if (fnName) {
+        triggerFunctionButton.classList.remove('is-hidden');
+        triggerFunctionButton.dataset.functionName = fnName;
+      } else {
+        triggerFunctionButton.classList.add('is-hidden');
+        triggerFunctionButton.dataset.functionName = '';
+      }
+    }
+  };
+
+  const loadTriggers = async () => {
+    try {
+      const data = await api('/triggers');
+      state.triggers = data.items || [];
+      buildTriggerFunctionMap(state.triggers);
+      renderTriggers(state.triggers);
+      renderFunctions(state.functions);
+      return state.triggers;
+    } catch (err) {
+      console.error(err);
+      return [];
+    }
+  };
+
+  const openTriggerByName = async (triggerName) => {
+    if (!triggerName) return;
+    setActiveTab('triggers');
+    const entries = state.triggers && state.triggers.length ? state.triggers : await loadTriggers();
+    const entry = (entries || []).find((item) => {
+      const content = item && item.content ? item.content : null;
+      const name = (content && content.name) || item.fileName || 'trigger';
+      return name === triggerName;
+    });
+    if (entry) {
+      showTriggerDetail(entry);
+    }
+  };
+
   const formatArgsPreview = (args) => {
     try {
       let preview = JSON.stringify(args);
@@ -794,9 +973,11 @@
       metaParts.push(formatTime(entry.ts));
       metaParts.push(runMode);
       if (userLabel) metaParts.push(userLabel);
+      const modifiedTag = entry.codeModified ? '<span class="modified-pill">modified</span>' : '';
       row.innerHTML = '<div class="history-meta">' +
         '<div class="code">' + entry.name + '</div>' +
-        '<div class="hint">' + metaParts.join(' · ') + ' · ' + formatArgsPreview(entry.args) + '</div>' +
+        '<div class="hint">' + metaParts.join(' · ') + ' · ' + formatArgsPreview(entry.args) +
+        (modifiedTag ? (' · ' + modifiedTag) : '') + '</div>' +
         '</div>' +
         '<div class="hint"></div>';
       functionHistory.appendChild(row);
@@ -821,10 +1002,34 @@
     functionRunMode.value = fn.run_as_system ? 'system' : 'user';
   };
 
-  const setEditorStatus = (text, isError) => {
-    if (!functionEditorStatus) return;
-    functionEditorStatus.textContent = text || '';
-    functionEditorStatus.classList.toggle('error', !!isError);
+  const setFunctionSelectedLabel = (name, modified) => {
+    if (!functionSelected) return;
+    if (!name) {
+      functionSelected.textContent = 'select a function';
+      return;
+    }
+    if (modified) {
+      functionSelected.innerHTML =
+        escapeHtml(name) + ' <span class="modified-pill">modified</span>';
+    } else {
+      functionSelected.textContent = name;
+    }
+  };
+
+  const isFunctionCodeModified = (name) => {
+    if (!name || !functionCode) return false;
+    const base = state.functionCodeCache[name];
+    if (typeof base !== 'string') return false;
+    return functionCode.value !== base;
+  };
+
+  const updateFunctionModifiedState = () => {
+    const name = state.selectedFunction;
+    const modified = isFunctionCodeModified(name);
+    setFunctionSelectedLabel(name, modified);
+    if (restoreFunction) {
+      restoreFunction.disabled = !modified;
+    }
   };
 
   const loadFunctionCode = async () => {
@@ -833,20 +1038,26 @@
     if (!name) {
       functionCode.value = '';
       updateFunctionEditor();
-      setEditorStatus('Select a function first', true);
+      updateFunctionModifiedState();
       return;
     }
     try {
-      setEditorStatus('loading...');
       const data = await api('/functions/' + encodeURIComponent(name));
       const baseCode = data && data.code ? data.code : '';
       state.functionCodeCache[name] = baseCode;
       functionCode.value = baseCode;
       updateFunctionEditor();
-      setEditorStatus('loaded');
     } catch (err) {
-      setEditorStatus('Error: ' + err.message, true);
+      console.error(err);
     }
+    updateFunctionModifiedState();
+  };
+
+  const applyFunctionOverride = (code) => {
+    if (!functionCode) return;
+    functionCode.value = code || '';
+    updateFunctionEditor();
+    updateFunctionModifiedState();
   };
 
   const clearFunctionOverride = () => {
@@ -856,7 +1067,7 @@
       functionCode.value = state.functionCodeCache[name] || '';
       updateFunctionEditor();
     }
-    setEditorStatus('override cleared');
+    updateFunctionModifiedState();
   };
 
   const buildFunctionUserOptions = (authItems, customItems) => {
@@ -1011,6 +1222,17 @@
     }
   };
 
+  const updateCollectionModeView = () => {
+    const mode = collectionMode ? collectionMode.value : (state.collectionMode || 'query');
+    if (collectionIo && collectionIo.dataset) {
+      collectionIo.dataset.mode = mode;
+    }
+    document.querySelectorAll('[data-collection-mode]').forEach((panel) => {
+      const panelMode = panel.dataset ? panel.dataset.collectionMode : null;
+      panel.classList.toggle('is-hidden', panelMode !== mode);
+    });
+  };
+
   const renderCollections = (items) => {
     if (!collectionList) return;
     collectionList.innerHTML = '';
@@ -1093,6 +1315,7 @@
     if (collectionMode && entry.mode) {
       collectionMode.value = entry.mode;
       state.collectionMode = entry.mode;
+      updateCollectionModeView();
     }
     if (collectionRunMode) {
       collectionRunMode.value = entry.runAsSystem ? 'system' : 'user';
@@ -1173,8 +1396,13 @@
     if (!keepPage) {
       state.collectionPage = 1;
     }
+    const shouldRefreshTotals = !keepPage || !state.collectionTotal;
     state.collectionHasMore = false;
-    state.collectionTotal = 0;
+    if (shouldRefreshTotals) {
+      state.collectionTotal = 0;
+    }
+    state.collectionLoading = true;
+    state.collectionTotalsLoading = shouldRefreshTotals;
     updateCollectionPager();
     const runAsSystem = !collectionRunMode || collectionRunMode.value === 'system';
     const selectedUser = state.selectedCollectionUser;
@@ -1208,10 +1436,15 @@
         if (typeof data.page === 'number') {
           state.collectionPage = data.page;
         }
-        if (typeof data.total === 'number') {
-          state.collectionTotal = data.total;
-        } else if (typeof data.count === 'number') {
-          state.collectionTotal = data.count;
+        if (shouldRefreshTotals) {
+          if (typeof data.total === 'number') {
+            state.collectionTotal = data.total;
+          } else if (typeof data.count === 'number') {
+            state.collectionTotal = data.count;
+          }
+          if (typeof data.pageSize === 'number') {
+            state.collectionPageSize = data.pageSize;
+          }
         }
         updateCollectionPager();
         setCollectionTab('query');
@@ -1235,10 +1468,15 @@
         if (typeof data.page === 'number') {
           state.collectionPage = data.page;
         }
-        if (typeof data.total === 'number') {
-          state.collectionTotal = data.total;
-        } else if (typeof data.count === 'number') {
-          state.collectionTotal = data.count;
+        if (shouldRefreshTotals) {
+          if (typeof data.total === 'number') {
+            state.collectionTotal = data.total;
+          } else if (typeof data.count === 'number') {
+            state.collectionTotal = data.count;
+          }
+          if (typeof data.pageSize === 'number') {
+            state.collectionPageSize = data.pageSize;
+          }
         }
         updateCollectionPager();
         setCollectionTab('query');
@@ -1258,6 +1496,9 @@
         setCollectionResult('Error: ' + err.message, false);
       }
     } finally {
+      state.collectionLoading = false;
+      state.collectionTotalsLoading = false;
+      updateCollectionPager();
       if (recordHistory) {
         loadCollectionHistory();
       }
@@ -1282,6 +1523,7 @@
     typeFilter.value = '';
     state.events = [];
     state.selectedEvent = null;
+    eventDetail.classList.remove('json-highlight');
     eventDetail.textContent = 'select an event to inspect payload';
     if (eventFunctionButton) {
       eventFunctionButton.classList.add('is-hidden');
@@ -1292,6 +1534,9 @@
 
   refreshUsers.addEventListener('click', loadUsers);
   refreshFunctions.addEventListener('click', loadFunctions);
+  if (refreshTriggers) {
+    refreshTriggers.addEventListener('click', loadTriggers);
+  }
   if (refreshCollections) {
     refreshCollections.addEventListener('click', loadCollections);
   }
@@ -1379,7 +1624,9 @@
       state.collectionMode = collectionMode.value;
       state.collectionPage = 1;
       state.collectionHasMore = false;
+      state.collectionLoading = false;
       updateCollectionPager();
+      updateCollectionModeView();
     });
   }
 
@@ -1418,6 +1665,36 @@
     });
   }
 
+  if (triggerList) {
+    triggerList.addEventListener('click', (event) => {
+      const target = (event.target && event.target.closest)
+        ? event.target.closest('.trigger-row')
+        : null;
+      if (!target) return;
+      const name = target.dataset.name;
+      const entry = (state.triggers || []).find((item) => {
+        const content = item && item.content ? item.content : null;
+        const triggerName = (content && content.name) || item.fileName || 'trigger';
+        return triggerName === name;
+      });
+      if (!entry) return;
+      showTriggerDetail(entry);
+    });
+  }
+
+  if (triggerFunctionButton) {
+    triggerFunctionButton.addEventListener('click', () => {
+      const fnName = triggerFunctionButton.dataset.functionName;
+      if (!fnName) return;
+      state.selectedFunction = fnName;
+      setActiveTab('functions');
+      renderFunctions(state.functions);
+      loadFunctionCode(fnName);
+    });
+  }
+
+  updateCollectionModeView();
+
   mergedUsers.addEventListener('click', async (event) => {
     const target = event.target;
     if (!target) return;
@@ -1427,6 +1704,10 @@
       if (!id) return;
       if (action === 'toggle') {
         const disabled = target.textContent === 'disable';
+        if (disabled) {
+          const ok = confirm('Disable user ' + id + '?');
+          if (!ok) return;
+        }
         await api('/users/' + id + '/status', {
           method: 'PATCH',
           body: JSON.stringify({ disabled })
@@ -1454,8 +1735,10 @@
     });
     const entry = state.mergedUserMap[id];
     if (entry) {
-      userDetail.textContent = JSON.stringify(entry, null, 2);
+      userDetail.classList.add('json-highlight');
+      userDetail.innerHTML = highlightJson(JSON.stringify(entry, null, 2) || '');
     } else {
+      userDetail.classList.remove('json-highlight');
       userDetail.textContent = 'User not found in cache';
     }
   });
@@ -1481,6 +1764,7 @@
   if (functionCode) {
     functionCode.addEventListener('input', () => {
       updateFunctionEditor();
+      updateFunctionModifiedState();
     });
     functionCode.addEventListener('scroll', () => {
       syncFunctionEditorScroll();
@@ -1596,12 +1880,20 @@
     const target = (event.target && event.target.closest)
       ? event.target.closest('.function-row')
       : null;
+    if (event.target && event.target.classList && event.target.classList.contains('trigger-link')) {
+      const triggerName = event.target.dataset ? event.target.dataset.trigger : null;
+      if (triggerName) {
+        openTriggerByName(triggerName);
+      }
+      event.stopPropagation();
+      return;
+    }
     if (!target) return;
     const name = target.dataset.name;
     if (!name) return;
     state.selectedFunction = name;
     state.selectedHistoryIndex = null;
-    functionSelected.textContent = name;
+    setFunctionSelectedLabel(name, false);
     functionResult.textContent = '';
     setRunModeForFunction(name);
     loadFunctionCode();
@@ -1677,7 +1969,7 @@
       if (!functionData) return;
       state.selectedFunction = functionData.name;
       state.selectedHistoryIndex = null;
-      functionSelected.textContent = functionData.name;
+      setFunctionSelectedLabel(functionData.name, false);
       functionArgs.value = JSON.stringify(functionData.args || [], null, 2);
       functionResult.textContent = '';
       setRunModeForFunction(functionData.name);
@@ -1699,7 +1991,7 @@
       if (!entry) return;
       state.selectedFunction = entry.name;
       state.selectedHistoryIndex = index;
-      functionSelected.textContent = entry.name;
+      setFunctionSelectedLabel(entry.name, false);
       functionArgs.value = JSON.stringify(entry.args || [], null, 2);
       if (functionRunMode && typeof entry.runAsSystem === 'boolean') {
         functionRunMode.value = entry.runAsSystem ? 'system' : 'user';
@@ -1720,7 +2012,14 @@
         setSelectedFunctionUser(null);
       }
       functionResult.textContent = '';
-      loadFunctionCode();
+      const loadPromise = loadFunctionCode();
+      if (entry.code) {
+        Promise.resolve(loadPromise).then(() => {
+          applyFunctionOverride(entry.code);
+        });
+      } else {
+        updateFunctionModifiedState();
+      }
       renderFunctions(state.functions);
       renderHistory();
     });
@@ -1785,6 +2084,7 @@
   setInterval(updateClock, 1000);
   updateClock();
   updateFunctionEditor();
+  updateFunctionModifiedState();
   updateCollectionPager();
   setCollectionTab('query');
   setCollectionResultView('json');
@@ -1821,6 +2121,7 @@
   connectWs();
   loadUsers();
   loadFunctions();
+  loadTriggers();
   loadCollections();
   loadCollectionHistory();
 })();