@startsimpli/integrations 0.2.33 → 0.2.35

package/src/components/pages/ConnectionsPage.tsx

@@ -47,6 +47,7 @@ import type {
   ConnectionChoicePage,
   ConnectionInvokeResult,
   ConnectionPermissions,
+  ConnectionRun,
   ConnectionTarget,
   ConnectorAction,
   ConnectorCatalogEntry,
@@ -135,6 +136,16 @@ interface BoundApi {
   invokeConnectionAction?(id: string, action: string, input: {
     destination_id: string; record_type?: string; records?: unknown[];
   }): Promise<ConnectionInvokeResult>;
+  /**
+   * RECENT ACTIVITY on both legs (bd startsim-ei8gm.2). Required on both
+   * injected interfaces and, until this bead, called by nothing — so the reason
+   * a run failed reached the payload and never a pixel.
+   *
+   * Optional HERE for the reason every other verb on this type is: an app
+   * pinned to an older `@startsimpli/api` keeps type-checking, and the card
+   * renders no control rather than a button whose handler is `undefined`.
+   */
+  connectionRuns?(id: string): Promise<{ results: ConnectionRun[] }>;
   /** Per-member governance (bd startsim-768w.22.25.8). Foundry mode only, and
       absent on an api that predates the endpoints — see `ConnectionsApi`. */
   /** The OAuth hand-off (bd startsim-768w.22.25.14/.23). Optional: an app on an
@@ -179,7 +190,16 @@ function bindApi(props: ConnectionsPageProps): BoundApi {
     ? { disconnectMemberConnection: (id: string) =>
       api.disconnectMemberConnection!(slug, id) }
     : {};
+  // Bound only when the injected client HAS it, even though `ConnectionsApi`
+  // declares it required: apps consume `@startsimpli/*` as PUBLISHED packages,
+  // so a runtime object that predates the verb is a real state the TYPE cannot
+  // see (bd startsim-ei8gm.2). Same rule as the four above — a wrapper that
+  // always exists and throws inside would render the control and fail on click.
+  const runs = api.connectionRuns
+    ? { connectionRuns: (id: string) => api.connectionRuns(slug, id) }
+    : {};
   return {
+    ...runs,
     ...memberPolicy,
     ...oauth,
     ...roster,
@@ -216,6 +236,21 @@ const DEFAULTS = {
   error: 'text-sm text-red-600',
 };
 
+/**
+ * WHICH LEG A RUN BELONGS TO, in a reader's words (bd startsim-ei8gm.2).
+ *
+ * The card merges three tables — `SourceRun`, `DestinationRun` and
+ * `DestinationWebhookEvent` — into one list, and "failed" means a different
+ * thing and needs a different action on each. Data with a fall-through to the
+ * raw key, the same rule `CAPABILITY_COPY` below states: a `kind` this bundle
+ * has never heard of renders as itself rather than vanishing from the list.
+ */
+const RUN_KIND_COPY: Record<string, string> = {
+  source_run: 'Fetched in',
+  destination_run: 'Sent out',
+  webhook_event: 'Received',
+};
+
 /**
  * WHAT AN ADMIN IS AGREEING TO, in their words rather than the wire's.
  *
@@ -1088,6 +1123,10 @@ function ConnectionCard({
   const [replacing, setReplacing] = React.useState(false);
   const [settingsOpen, setSettingsOpen] = React.useState(false);
   const [confirmingDisconnect, setConfirmingDisconnect] = React.useState(false);
+  const [activityOpen, setActivityOpen] = React.useState(false);
+  /** `null` is NOT LOADED YET, which reads differently from a connection that
+      has never run — the distinction the empty state below turns on. */
+  const [runs, setRuns] = React.useState<ConnectionRun[] | null>(null);
 
   const declared = entry?.capabilities;
   const enabled = React.useMemo(
@@ -1138,102 +1177,169 @@ function ConnectionCard({
             <p className={cn.error}>{connection.check_error}</p>
           ) : null}
         </div>
-        {canManage ? (
-          <div className="flex flex-wrap justify-end gap-2">
-            <button
-              type="button"
-              className={cn.button}
-              disabled={Boolean(busy)}
-              onClick={() => void guard('check', async () => {
-                const res = await api.checkConnection(connection.id);
-                setNotice(res.detail || (res.ok ? 'Connection is healthy.' : ''));
-                onChanged();
-              })}
-            >
-              Test
-            </button>
-            {/* THE CONTROL THIS PAGE WAS MISSING. A vendor key gets rotated —
-                that is normal operations, not an exception — and the only place
-                to put the new one was a form that creates a second account. */}
+        <div className="flex flex-wrap justify-end gap-2">
+          {/* ACTIVITY IS OUTSIDE THE MANAGE GATE, and deliberately. Reading the
+              run ledger needs `view_connections` server-side, which is what put
+              this card on the screen at all — and the person who most needs to
+              know WHY a connection is failing is often the one who cannot fix
+              it themselves. Gating the answer behind the permission to act
+              would leave them with the word "Failing" and nothing else, which
+              is the sixteen days this bead is about. */}
+          {api.connectionRuns ? (
             <button
               type="button"
               className={cn.button}
               disabled={Boolean(busy)}
               onClick={() => {
-                setConfirmingDisconnect(false);
-                setError('');
-                setReplacing((v) => !v);
+                const opening = !activityOpen;
+                setActivityOpen(opening);
+                if (!opening) return;
+                void guard('activity', async () => {
+                  const page = await api.connectionRuns!(connection.id);
+                  setRuns(page.results ?? []);
+                });
               }}
             >
-              {replacing ? 'Cancel' : 'Replace key'}
+              {activityOpen ? 'Hide activity' : 'Activity'}
             </button>
-            {/* DISCOVER -> WIRE -> FIRE is foundry-level and stays there. The
-                member router serves no choices, targets or actions at all, so
-                the control is gated on the verb EXISTING rather than on a mode
-                flag — there is no way to render a button here whose handler is
-                undefined. */}
-            {api.connectionChoices && api.connectionActions ? (
+          ) : null}
+          {canManage ? (
+            <>
               <button
                 type="button"
                 className={cn.button}
                 disabled={Boolean(busy)}
-                onClick={() => void guard('discover', async () => {
-                  const page = await api.connectionChoices!(connection.id);
-                  setChoices(page.results ?? []);
-                  const available = await api.connectionActions!(connection.id);
-                  setActions(available.results ?? []);
+                onClick={() => void guard('check', async () => {
+                  const res = await api.checkConnection(connection.id);
+                  setNotice(res.detail || (res.ok ? 'Connection is healthy.' : ''));
+                  onChanged();
                 })}
               >
-                {busy === 'discover' ? 'Loading…' : 'Workflows'}
+                Test
               </button>
-            ) : null}
-            {/* SETTINGS, which this card has never had. A connector's
-                `config_schema` ships on every catalog row and was rendered
-                exactly once — on the connect form, before the account existed.
-                After that a setting could not be changed from the product at
-                all, which for Granola means the switch deciding whether verbatim
-                recordings of people's conversations are stored was reachable
-                only by editing the database. `ReplaceKeyForm` already pointed at
-                "the connection's own settings" as if this existed.
+              {/* THE CONTROL THIS PAGE WAS MISSING. A vendor key gets rotated —
+                  that is normal operations, not an exception — and the only place
+                  to put the new one was a form that creates a second account. */}
+              <button
+                type="button"
+                className={cn.button}
+                disabled={Boolean(busy)}
+                onClick={() => {
+                  setConfirmingDisconnect(false);
+                  setError('');
+                  setReplacing((v) => !v);
+                }}
+              >
+                {replacing ? 'Cancel' : 'Replace key'}
+              </button>
+              {/* DISCOVER -> WIRE -> FIRE is foundry-level and stays there. The
+                  member router serves no choices, targets or actions at all, so
+                  the control is gated on the verb EXISTING rather than on a mode
+                  flag — there is no way to render a button here whose handler is
+                  undefined. */}
+              {api.connectionChoices && api.connectionActions ? (
+                <button
+                  type="button"
+                  className={cn.button}
+                  disabled={Boolean(busy)}
+                  onClick={() => void guard('discover', async () => {
+                    const page = await api.connectionChoices!(connection.id);
+                    setChoices(page.results ?? []);
+                    const available = await api.connectionActions!(connection.id);
+                    setActions(available.results ?? []);
+                  })}
+                >
+                  {busy === 'discover' ? 'Loading…' : 'Workflows'}
+                </button>
+              ) : null}
+              {/* SETTINGS, which this card has never had. A connector's
+                  `config_schema` ships on every catalog row and was rendered
+                  exactly once — on the connect form, before the account existed.
+                  After that a setting could not be changed from the product at
+                  all, which for Granola means the switch deciding whether verbatim
+                  recordings of people's conversations are stored was reachable
+                  only by editing the database. `ReplaceKeyForm` already pointed at
+                  "the connection's own settings" as if this existed.
 
-                GATED ON THE SETTINGS VERB, not on the general one (bd
-                startsim-sfms2). The member surface has `updateConnectionConfig`
-                and deliberately not `updateConnection`, because a personal
-                connection's config is the MEMBER's privacy boundary while its
-                name and what it may do stay the foundry's. One gate for both
-                would have made opening this control open the capability Save
-                beside it, which is a decision this change did not make. */}
-            {configFields.length && api.updateConnectionConfig ? (
+                  GATED ON THE SETTINGS VERB, not on the general one (bd
+                  startsim-sfms2). The member surface has `updateConnectionConfig`
+                  and deliberately not `updateConnection`, because a personal
+                  connection's config is the MEMBER's privacy boundary while its
+                  name and what it may do stay the foundry's. One gate for both
+                  would have made opening this control open the capability Save
+                  beside it, which is a decision this change did not make. */}
+              {configFields.length && api.updateConnectionConfig ? (
+                <button
+                  type="button"
+                  className={cn.button}
+                  disabled={Boolean(busy) || confirmingDisconnect}
+                  onClick={() => {
+                    setReplacing(false);
+                    setError('');
+                    setSettingsOpen((v) => !v);
+                  }}
+                >
+                  {settingsOpen ? 'Close settings' : 'Settings'}
+                </button>
+              ) : null}
               <button
                 type="button"
                 className={cn.button}
                 disabled={Boolean(busy) || confirmingDisconnect}
                 onClick={() => {
                   setReplacing(false);
+                  setSettingsOpen(false);
                   setError('');
-                  setSettingsOpen((v) => !v);
+                  setConfirmingDisconnect(true);
                 }}
               >
-                {settingsOpen ? 'Close settings' : 'Settings'}
+                Disconnect
               </button>
-            ) : null}
-            <button
-              type="button"
-              className={cn.button}
-              disabled={Boolean(busy) || confirmingDisconnect}
-              onClick={() => {
-                setReplacing(false);
-                setSettingsOpen(false);
-                setError('');
-                setConfirmingDisconnect(true);
-              }}
-            >
-              Disconnect
-            </button>
-          </div>
-        ) : null}
+            </>
+          ) : null}
+        </div>
       </div>
 
+      {activityOpen ? (
+        <div className="mt-3 space-y-2 border-t pt-3" role="group"
+             aria-label="Recent activity">
+          {/* THE FIELD NOTHING HAS EVER READ. `ConnectionRun.error_message` has
+              been declared in this package's types since the endpoint existed;
+              until #375 the server answered `""` for every source run ever
+              recorded, and even after it did not, no component asked. A failed
+              run rendered as a status word, which is a fact the reader already
+              had from the card above it.
+
+              RENDERED AS THE SERVER WROTE IT. The text is scrubbed against this
+              connection's stored credential and the platform app_secret before
+              it leaves Django (`surface.py::_reason_reader`), and a reason that
+              could not be scrubbed arrives as a sentence saying so. There is
+              one redaction path in this estate and it is not in the browser —
+              which does not hold the secrets to run it. */}
+          {busy === 'activity' && runs === null ? (
+            <p className={cn.muted}>Loading recent activity…</p>
+          ) : null}
+          {runs !== null && runs.length === 0 ? (
+            <p className={cn.muted}>No runs yet for this connection.</p>
+          ) : null}
+          {(runs ?? []).map((run) => (
+            <div key={run.id} data-run={run.id}>
+              <p className={cn.muted}>
+                <span className="font-medium text-gray-900">
+                  {RUN_KIND_COPY[run.kind] ?? run.kind}
+                </span>
+                {run.name ? ` · ${run.name}` : ''}
+                {` · ${run.status}`}
+                {run.occurred_at ? ` · ${new Date(run.occurred_at).toLocaleString()}` : ''}
+              </p>
+              {run.error_message ? (
+                <p className={cn.error}>{run.error_message}</p>
+              ) : null}
+            </div>
+          ))}
+        </div>
+      ) : null}
+
       {settingsOpen ? (
         <ConnectionSettingsForm
           api={api}