@shipfox/client-integrations 4.0.0 → 6.0.1

package/.turbo/turbo-build.log

@@ -1,2 +1,2 @@
 $ shipfox-swc
-Successfully compiled: 48 files with swc (452.44ms)
+Successfully compiled: 51 files with swc (94.41ms)

package/CHANGELOG.md

@@ -1,5 +1,91 @@
 # @shipfox/client-integrations
 
+## 6.0.1
+
+### Patch Changes
+
+- 475ce59: Republishes all public packages after restoring release authorization.
+- 3f8f1cb: Enforces typed route-input and browser-storage boundaries across client features.
+- Updated dependencies [475ce59]
+- Updated dependencies [3f8f1cb]
+  - @shipfox/api-integration-core-dto@9.0.1
+  - @shipfox/api-integration-gitea-dto@9.0.1
+  - @shipfox/api-integration-github-dto@9.0.1
+  - @shipfox/api-integration-linear-dto@9.0.1
+  - @shipfox/api-integration-sentry-dto@9.0.1
+  - @shipfox/api-integration-slack-dto@9.0.1
+  - @shipfox/api-integration-webhook-dto@9.0.1
+  - @shipfox/client-api@6.0.1
+  - @shipfox/client-auth@6.0.1
+  - @shipfox/client-shell@6.0.1
+  - @shipfox/client-ui@6.0.1
+  - @shipfox/integration-icons@0.2.1
+  - @shipfox/react-ui@0.3.6
+
+## 6.0.0
+
+### Major Changes
+
+- 24be269: Makes checked API adapters the only public business-response boundary and returns package-owned domain models from Agent, Integrations, and Workflows adapters.
+- c02ac42: Converges the integrations client on a package-owned domain model (camelCase, schema-validated) instead of exposing raw snake_case API DTOs, changing the shape of `useSourceConnectionsQuery`, `useIntegrationConnectionsQuery`, `useIntegrationProvidersQuery`, `useRepositoriesInfiniteQuery`, and the `ConnectionPicker`/`ProviderGrid`/`RepositoryPicker` props. Adds `emptyResponseSchema` to `@shipfox/client-api` for schema-validated DELETE requests with no response body.
+
+### Minor Changes
+
+- 401b583: Exposes typed feature-owned navigation and settings contributions and enforces coordinator-owned client composition.
+
+### Patch Changes
+
+- d784a07: Enforces checked client API responses and removes stale transport compatibility helpers.
+- f2d50a8: Extracts shared integration provider icons into a leaf package so client features can render them without depending on integration routing code.
+- cd90c19: Enforces package-owned query policies and explicit cache-operation ownership across client resources.
+- 9d8f510: Converges integration callback flows on domain-owned models and safe cache refreshes.
+- Updated dependencies [401b583]
+- Updated dependencies [d784a07]
+- Updated dependencies [891e469]
+- Updated dependencies [82eda45]
+- Updated dependencies [f2d50a8]
+- Updated dependencies [cd90c19]
+- Updated dependencies [24be269]
+- Updated dependencies [c56c124]
+- Updated dependencies [02974d6]
+- Updated dependencies [4a6d124]
+- Updated dependencies [c02ac42]
+  - @shipfox/client-shell@6.0.0
+  - @shipfox/client-auth@6.0.0
+  - @shipfox/integration-icons@0.2.0
+  - @shipfox/client-api@6.0.0
+  - @shipfox/api-integration-core-dto@9.0.0
+  - @shipfox/api-integration-github-dto@9.0.0
+  - @shipfox/api-integration-gitea-dto@9.0.0
+  - @shipfox/api-integration-linear-dto@9.0.0
+  - @shipfox/api-integration-sentry-dto@9.0.0
+  - @shipfox/api-integration-slack-dto@9.0.0
+  - @shipfox/api-integration-webhook-dto@9.0.0
+  - @shipfox/client-ui@6.0.0
+  - @shipfox/react-ui@0.3.5
+
+## 5.0.0
+
+### Minor Changes
+
+- 8d8cdef: Extracts workspace onboarding into a dedicated coordinator and shares its feature query policies.
+
+### Patch Changes
+
+- ffd727b: Converges auth session and invitation state onto shared camelCase domain types validated at the API boundary, replacing the raw snake_case DTOs previously returned by login, signup, password reset, email verification, workspace creation, and invitation preview. `AuthState.user`, `useRefreshAuth()`, and `usePreviewInvitation()` now resolve to `UserIdentity`/`AuthenticatedSession`/`InvitationPreview` shapes (for example `accessToken` instead of `token`, `workspaceName` instead of `workspace_name`). Also moves the shared `AuthShell` component and session mapping helpers into `@shipfox/client-shell`, breaking the former `client-auth` ↔ `client-invitations` circular dependency.
+- f1d6465: Moves workspace-settings and project-workflow route ownership from centralized packages into each feature's own route module, so a feature package declares and ships its own settings pages.
+- Updated dependencies [ffd727b]
+- Updated dependencies [7f227c6]
+  - @shipfox/client-shell@5.0.0
+  - @shipfox/client-auth@5.0.0
+  - @shipfox/api-integration-core-dto@8.0.0
+  - @shipfox/api-integration-gitea-dto@8.0.0
+  - @shipfox/api-integration-github-dto@8.0.0
+  - @shipfox/api-integration-linear-dto@8.0.0
+  - @shipfox/api-integration-sentry-dto@8.0.0
+  - @shipfox/api-integration-slack-dto@8.0.0
+  - @shipfox/api-integration-webhook-dto@8.0.0
+
 ## 4.0.0
 
 ### Patch Changes

package/dist/application/complete-integration-callback.d.ts

@@ -0,0 +1,13 @@
+import { type QueryClient } from '@tanstack/react-query';
+import type { IntegrationConnection } from '#core/models.js';
+export interface CompleteIntegrationCallbackOptions<TInput> {
+    input: TInput;
+    refreshAuth: () => Promise<{
+        accessToken: string;
+    }>;
+    complete: (input: TInput, accessToken: string) => Promise<IntegrationConnection>;
+    queryClient: QueryClient;
+}
+export declare function completeIntegrationCallback<TInput>({ input, refreshAuth, complete, queryClient, }: CompleteIntegrationCallbackOptions<TInput>): Promise<IntegrationConnection>;
+export declare function useCompleteIntegrationCallback(): <TInput>(options: Omit<CompleteIntegrationCallbackOptions<TInput>, "queryClient">) => Promise<IntegrationConnection>;
+//# sourceMappingURL=complete-integration-callback.d.ts.map

package/dist/application/complete-integration-callback.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"complete-integration-callback.d.ts","sourceRoot":"","sources":["../../src/application/complete-integration-callback.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,WAAW,EAAiB,MAAM,uBAAuB,CAAC;AAEvE,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AAG3D,MAAM,WAAW,kCAAkC,CAAC,MAAM;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,OAAO,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAC,CAAC,CAAC;IAClD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,KAAK,OAAO,CAAC,qBAAqB,CAAC,CAAC;IACjF,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,wBAAsB,2BAA2B,CAAC,MAAM,EAAE,EACxD,KAAK,EACL,WAAW,EACX,QAAQ,EACR,WAAW,GACZ,EAAE,kCAAkC,CAAC,MAAM,CAAC,GAAG,OAAO,CAAC,qBAAqB,CAAC,CAW7E;AAED,wBAAgB,8BAA8B,KAGnC,MAAM,WACF,IAAI,CAAC,kCAAkC,CAAC,MAAM,CAAC,EAAE,aAAa,CAAC,KACvE,OAAO,CAAC,qBAAqB,CAAC,CAGpC"}

package/dist/application/complete-integration-callback.js

@@ -0,0 +1,26 @@
+import { useQueryClient } from '@tanstack/react-query';
+import { useCallback } from 'react';
+import { integrationsQueryKeys } from '#hooks/api/integrations.js';
+export async function completeIntegrationCallback({ input, refreshAuth, complete, queryClient }) {
+    const session = await refreshAuth();
+    const connection = await complete(input, session.accessToken);
+    try {
+        await queryClient.invalidateQueries({
+            queryKey: integrationsQueryKeys.connectionsByWorkspace(connection.workspaceId)
+        });
+    } catch  {
+    // Cache refresh is best effort: the successful callback is already committed server-side.
+    }
+    return connection;
+}
+export function useCompleteIntegrationCallback() {
+    const queryClient = useQueryClient();
+    return useCallback(async (options)=>completeIntegrationCallback({
+            ...options,
+            queryClient
+        }), [
+        queryClient
+    ]);
+}
+
+//# sourceMappingURL=complete-integration-callback.js.map

package/dist/application/complete-integration-callback.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/application/complete-integration-callback.ts"],"sourcesContent":["import {type QueryClient, useQueryClient} from '@tanstack/react-query';\nimport {useCallback} from 'react';\nimport type {IntegrationConnection} from '#core/models.js';\nimport {integrationsQueryKeys} from '#hooks/api/integrations.js';\n\nexport interface CompleteIntegrationCallbackOptions<TInput> {\n  input: TInput;\n  refreshAuth: () => Promise<{accessToken: string}>;\n  complete: (input: TInput, accessToken: string) => Promise<IntegrationConnection>;\n  queryClient: QueryClient;\n}\n\nexport async function completeIntegrationCallback<TInput>({\n  input,\n  refreshAuth,\n  complete,\n  queryClient,\n}: CompleteIntegrationCallbackOptions<TInput>): Promise<IntegrationConnection> {\n  const session = await refreshAuth();\n  const connection = await complete(input, session.accessToken);\n  try {\n    await queryClient.invalidateQueries({\n      queryKey: integrationsQueryKeys.connectionsByWorkspace(connection.workspaceId),\n    });\n  } catch {\n    // Cache refresh is best effort: the successful callback is already committed server-side.\n  }\n  return connection;\n}\n\nexport function useCompleteIntegrationCallback() {\n  const queryClient = useQueryClient();\n  return useCallback(\n    async <TInput>(\n      options: Omit<CompleteIntegrationCallbackOptions<TInput>, 'queryClient'>,\n    ): Promise<IntegrationConnection> => completeIntegrationCallback({...options, queryClient}),\n    [queryClient],\n  );\n}\n"],"names":["useQueryClient","useCallback","integrationsQueryKeys","completeIntegrationCallback","input","refreshAuth","complete","queryClient","session","connection","accessToken","invalidateQueries","queryKey","connectionsByWorkspace","workspaceId","useCompleteIntegrationCallback","options"],"mappings":"AAAA,SAA0BA,cAAc,QAAO,wBAAwB;AACvE,SAAQC,WAAW,QAAO,QAAQ;AAElC,SAAQC,qBAAqB,QAAO,6BAA6B;AASjE,OAAO,eAAeC,4BAAoC,EACxDC,KAAK,EACLC,WAAW,EACXC,QAAQ,EACRC,WAAW,EACgC;IAC3C,MAAMC,UAAU,MAAMH;IACtB,MAAMI,aAAa,MAAMH,SAASF,OAAOI,QAAQE,WAAW;IAC5D,IAAI;QACF,MAAMH,YAAYI,iBAAiB,CAAC;YAClCC,UAAUV,sBAAsBW,sBAAsB,CAACJ,WAAWK,WAAW;QAC/E;IACF,EAAE,OAAM;IACN,0FAA0F;IAC5F;IACA,OAAOL;AACT;AAEA,OAAO,SAASM;IACd,MAAMR,cAAcP;IACpB,OAAOC,YACL,OACEe,UACmCb,4BAA4B;YAAC,GAAGa,OAAO;YAAET;QAAW,IACzF;QAACA;KAAY;AAEjB"}

package/dist/components/connection-picker.d.ts

@@ -1,6 +1,6 @@
-import type { IntegrationConnectionDto } from '@shipfox/api-integration-core-dto';
+import type { IntegrationConnection } from '#core/models.js';
 export declare function ConnectionPicker({ connections, selectedConnectionId, onSelect, }: {
-    connections: IntegrationConnectionDto[];
+    connections: IntegrationConnection[];
     selectedConnectionId: string | undefined;
     onSelect: (connectionId: string) => void;
 }): import("react").JSX.Element;

package/dist/components/connection-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"connection-picker.d.ts","sourceRoot":"","sources":["../../src/components/connection-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,wBAAwB,EAAC,MAAM,mCAAmC,CAAC;AAShF,wBAAgB,gBAAgB,CAAC,EAC/B,WAAW,EACX,oBAAoB,EACpB,QAAQ,GACT,EAAE;IACD,WAAW,EAAE,wBAAwB,EAAE,CAAC;IACxC,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAC;IACzC,QAAQ,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C,+BAsBA"}
+{"version":3,"file":"connection-picker.d.ts","sourceRoot":"","sources":["../../src/components/connection-picker.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AAE3D,wBAAgB,gBAAgB,CAAC,EAC/B,WAAW,EACX,oBAAoB,EACpB,QAAQ,GACT,EAAE;IACD,WAAW,EAAE,qBAAqB,EAAE,CAAC;IACrC,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAC;IACzC,QAAQ,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C,+BAsBA"}

package/dist/components/connection-picker.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { IntegrationIcon } from '@shipfox/integration-icons';
 import { useIsTextTruncated } from '@shipfox/react-ui/hooks';
 import { Label } from '@shipfox/react-ui/label';
 import { RadioGroup, RadioGroupItem } from '@shipfox/react-ui/radio-group';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@shipfox/react-ui/tooltip';
 import { Text } from '@shipfox/react-ui/typography';
 import { useId } from 'react';
-import { IntegrationIcon } from '#integration-icon.js';
 export function ConnectionPicker({ connections, selectedConnectionId, onSelect }) {
     const labelId = useId();
     return /*#__PURE__*/ _jsxs("div", {
@@ -33,7 +33,7 @@ export function ConnectionPicker({ connections, selectedConnectionId, onSelect }
     });
 }
 function ConnectionOption({ connection }) {
-    const { ref: nameRef, isTruncated } = useIsTextTruncated(connection.display_name);
+    const { ref: nameRef, isTruncated } = useIsTextTruncated(connection.displayName);
     return /*#__PURE__*/ _jsxs("span", {
         className: "flex min-w-0 items-center gap-10",
         children: [
@@ -66,12 +66,12 @@ function ConnectionOption({ connection }) {
                                 as: "span",
                                 size: "sm",
                                 bold: true,
-                                children: connection.display_name
+                                children: connection.displayName
                             })
                         })
                     }),
                     isTruncated ? /*#__PURE__*/ _jsx(TooltipContent, {
-                        children: connection.display_name
+                        children: connection.displayName
                     }) : null
                 ]
             })

package/dist/components/connection-picker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/connection-picker.tsx"],"sourcesContent":["import type {IntegrationConnectionDto} from '@shipfox/api-integration-core-dto';\nimport {useIsTextTruncated} from '@shipfox/react-ui/hooks';\nimport {Label} from '@shipfox/react-ui/label';\nimport {RadioGroup, RadioGroupItem} from '@shipfox/react-ui/radio-group';\nimport {Tooltip, TooltipContent, TooltipTrigger} from '@shipfox/react-ui/tooltip';\nimport {Text} from '@shipfox/react-ui/typography';\nimport {useId} from 'react';\nimport {IntegrationIcon} from '#integration-icon.js';\n\nexport function ConnectionPicker({\n  connections,\n  selectedConnectionId,\n  onSelect,\n}: {\n  connections: IntegrationConnectionDto[];\n  selectedConnectionId: string | undefined;\n  onSelect: (connectionId: string) => void;\n}) {\n  const labelId = useId();\n\n  return (\n    <div className=\"flex flex-col gap-10\">\n      <Label id={labelId} className=\"sr-only\">\n        Source integration\n      </Label>\n      <RadioGroup\n        aria-labelledby={labelId}\n        value={selectedConnectionId ?? ''}\n        onValueChange={onSelect}\n        className=\"grid grid-cols-2 gap-8 min-[1200px]:grid-cols-3 max-[760px]:grid-cols-1\"\n      >\n        {connections.map((connection) => (\n          <RadioGroupItem key={connection.id} value={connection.id} className=\"p-12\">\n            <ConnectionOption connection={connection} />\n          </RadioGroupItem>\n        ))}\n      </RadioGroup>\n    </div>\n  );\n}\n\nfunction ConnectionOption({connection}: {connection: IntegrationConnectionDto}) {\n  const {ref: nameRef, isTruncated} = useIsTextTruncated<HTMLSpanElement>(connection.display_name);\n\n  return (\n    <span className=\"flex min-w-0 items-center gap-10\">\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <span className=\"shrink-0\">\n            <IntegrationIcon\n              source={connection.provider}\n              aria-hidden\n              className=\"size-20 text-foreground-neutral-base\"\n            />\n          </span>\n        </TooltipTrigger>\n        <TooltipContent>{integrationName(connection.provider)}</TooltipContent>\n      </Tooltip>\n\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <span ref={nameRef} className=\"min-w-0 truncate\">\n            <Text as=\"span\" size=\"sm\" bold>\n              {connection.display_name}\n            </Text>\n          </span>\n        </TooltipTrigger>\n        {isTruncated ? <TooltipContent>{connection.display_name}</TooltipContent> : null}\n      </Tooltip>\n    </span>\n  );\n}\n\nfunction integrationName(provider: string): string {\n  switch (provider) {\n    case 'github':\n      return 'GitHub';\n    case 'gitea':\n      return 'Gitea';\n    case 'sentry':\n      return 'Sentry';\n    case 'webhook':\n      return 'Webhook';\n    case 'debug':\n      return 'Debug';\n    default:\n      return provider;\n  }\n}\n"],"names":["useIsTextTruncated","Label","RadioGroup","RadioGroupItem","Tooltip","TooltipContent","TooltipTrigger","Text","useId","IntegrationIcon","ConnectionPicker","connections","selectedConnectionId","onSelect","labelId","div","className","id","aria-labelledby","value","onValueChange","map","connection","ConnectionOption","ref","nameRef","isTruncated","display_name","span","asChild","source","provider","aria-hidden","integrationName","as","size","bold"],"mappings":";AACA,SAAQA,kBAAkB,QAAO,0BAA0B;AAC3D,SAAQC,KAAK,QAAO,0BAA0B;AAC9C,SAAQC,UAAU,EAAEC,cAAc,QAAO,gCAAgC;AACzE,SAAQC,OAAO,EAAEC,cAAc,EAAEC,cAAc,QAAO,4BAA4B;AAClF,SAAQC,IAAI,QAAO,+BAA+B;AAClD,SAAQC,KAAK,QAAO,QAAQ;AAC5B,SAAQC,eAAe,QAAO,uBAAuB;AAErD,OAAO,SAASC,iBAAiB,EAC/BC,WAAW,EACXC,oBAAoB,EACpBC,QAAQ,EAKT;IACC,MAAMC,UAAUN;IAEhB,qBACE,MAACO;QAAIC,WAAU;;0BACb,KAACf;gBAAMgB,IAAIH;gBAASE,WAAU;0BAAU;;0BAGxC,KAACd;gBACCgB,mBAAiBJ;gBACjBK,OAAOP,wBAAwB;gBAC/BQ,eAAeP;gBACfG,WAAU;0BAETL,YAAYU,GAAG,CAAC,CAACC,2BAChB,KAACnB;wBAAmCgB,OAAOG,WAAWL,EAAE;wBAAED,WAAU;kCAClE,cAAA,KAACO;4BAAiBD,YAAYA;;uBADXA,WAAWL,EAAE;;;;AAO5C;AAEA,SAASM,iBAAiB,EAACD,UAAU,EAAyC;IAC5E,MAAM,EAACE,KAAKC,OAAO,EAAEC,WAAW,EAAC,GAAG1B,mBAAoCsB,WAAWK,YAAY;IAE/F,qBACE,MAACC;QAAKZ,WAAU;;0BACd,MAACZ;;kCACC,KAACE;wBAAeuB,OAAO;kCACrB,cAAA,KAACD;4BAAKZ,WAAU;sCACd,cAAA,KAACP;gCACCqB,QAAQR,WAAWS,QAAQ;gCAC3BC,aAAW;gCACXhB,WAAU;;;;kCAIhB,KAACX;kCAAgB4B,gBAAgBX,WAAWS,QAAQ;;;;0BAGtD,MAAC3B;;kCACC,KAACE;wBAAeuB,OAAO;kCACrB,cAAA,KAACD;4BAAKJ,KAAKC;4BAAST,WAAU;sCAC5B,cAAA,KAACT;gCAAK2B,IAAG;gCAAOC,MAAK;gCAAKC,IAAI;0CAC3Bd,WAAWK,YAAY;;;;oBAI7BD,4BAAc,KAACrB;kCAAgBiB,WAAWK,YAAY;yBAAqB;;;;;AAIpF;AAEA,SAASM,gBAAgBF,QAAgB;IACvC,OAAQA;QACN,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT;YACE,OAAOA;IACX;AACF"}
+{"version":3,"sources":["../../src/components/connection-picker.tsx"],"sourcesContent":["import {IntegrationIcon} from '@shipfox/integration-icons';\nimport {useIsTextTruncated} from '@shipfox/react-ui/hooks';\nimport {Label} from '@shipfox/react-ui/label';\nimport {RadioGroup, RadioGroupItem} from '@shipfox/react-ui/radio-group';\nimport {Tooltip, TooltipContent, TooltipTrigger} from '@shipfox/react-ui/tooltip';\nimport {Text} from '@shipfox/react-ui/typography';\nimport {useId} from 'react';\nimport type {IntegrationConnection} from '#core/models.js';\n\nexport function ConnectionPicker({\n  connections,\n  selectedConnectionId,\n  onSelect,\n}: {\n  connections: IntegrationConnection[];\n  selectedConnectionId: string | undefined;\n  onSelect: (connectionId: string) => void;\n}) {\n  const labelId = useId();\n\n  return (\n    <div className=\"flex flex-col gap-10\">\n      <Label id={labelId} className=\"sr-only\">\n        Source integration\n      </Label>\n      <RadioGroup\n        aria-labelledby={labelId}\n        value={selectedConnectionId ?? ''}\n        onValueChange={onSelect}\n        className=\"grid grid-cols-2 gap-8 min-[1200px]:grid-cols-3 max-[760px]:grid-cols-1\"\n      >\n        {connections.map((connection) => (\n          <RadioGroupItem key={connection.id} value={connection.id} className=\"p-12\">\n            <ConnectionOption connection={connection} />\n          </RadioGroupItem>\n        ))}\n      </RadioGroup>\n    </div>\n  );\n}\n\nfunction ConnectionOption({connection}: {connection: IntegrationConnection}) {\n  const {ref: nameRef, isTruncated} = useIsTextTruncated<HTMLSpanElement>(connection.displayName);\n\n  return (\n    <span className=\"flex min-w-0 items-center gap-10\">\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <span className=\"shrink-0\">\n            <IntegrationIcon\n              source={connection.provider}\n              aria-hidden\n              className=\"size-20 text-foreground-neutral-base\"\n            />\n          </span>\n        </TooltipTrigger>\n        <TooltipContent>{integrationName(connection.provider)}</TooltipContent>\n      </Tooltip>\n\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <span ref={nameRef} className=\"min-w-0 truncate\">\n            <Text as=\"span\" size=\"sm\" bold>\n              {connection.displayName}\n            </Text>\n          </span>\n        </TooltipTrigger>\n        {isTruncated ? <TooltipContent>{connection.displayName}</TooltipContent> : null}\n      </Tooltip>\n    </span>\n  );\n}\n\nfunction integrationName(provider: string): string {\n  switch (provider) {\n    case 'github':\n      return 'GitHub';\n    case 'gitea':\n      return 'Gitea';\n    case 'sentry':\n      return 'Sentry';\n    case 'webhook':\n      return 'Webhook';\n    case 'debug':\n      return 'Debug';\n    default:\n      return provider;\n  }\n}\n"],"names":["IntegrationIcon","useIsTextTruncated","Label","RadioGroup","RadioGroupItem","Tooltip","TooltipContent","TooltipTrigger","Text","useId","ConnectionPicker","connections","selectedConnectionId","onSelect","labelId","div","className","id","aria-labelledby","value","onValueChange","map","connection","ConnectionOption","ref","nameRef","isTruncated","displayName","span","asChild","source","provider","aria-hidden","integrationName","as","size","bold"],"mappings":";AAAA,SAAQA,eAAe,QAAO,6BAA6B;AAC3D,SAAQC,kBAAkB,QAAO,0BAA0B;AAC3D,SAAQC,KAAK,QAAO,0BAA0B;AAC9C,SAAQC,UAAU,EAAEC,cAAc,QAAO,gCAAgC;AACzE,SAAQC,OAAO,EAAEC,cAAc,EAAEC,cAAc,QAAO,4BAA4B;AAClF,SAAQC,IAAI,QAAO,+BAA+B;AAClD,SAAQC,KAAK,QAAO,QAAQ;AAG5B,OAAO,SAASC,iBAAiB,EAC/BC,WAAW,EACXC,oBAAoB,EACpBC,QAAQ,EAKT;IACC,MAAMC,UAAUL;IAEhB,qBACE,MAACM;QAAIC,WAAU;;0BACb,KAACd;gBAAMe,IAAIH;gBAASE,WAAU;0BAAU;;0BAGxC,KAACb;gBACCe,mBAAiBJ;gBACjBK,OAAOP,wBAAwB;gBAC/BQ,eAAeP;gBACfG,WAAU;0BAETL,YAAYU,GAAG,CAAC,CAACC,2BAChB,KAAClB;wBAAmCe,OAAOG,WAAWL,EAAE;wBAAED,WAAU;kCAClE,cAAA,KAACO;4BAAiBD,YAAYA;;uBADXA,WAAWL,EAAE;;;;AAO5C;AAEA,SAASM,iBAAiB,EAACD,UAAU,EAAsC;IACzE,MAAM,EAACE,KAAKC,OAAO,EAAEC,WAAW,EAAC,GAAGzB,mBAAoCqB,WAAWK,WAAW;IAE9F,qBACE,MAACC;QAAKZ,WAAU;;0BACd,MAACX;;kCACC,KAACE;wBAAesB,OAAO;kCACrB,cAAA,KAACD;4BAAKZ,WAAU;sCACd,cAAA,KAAChB;gCACC8B,QAAQR,WAAWS,QAAQ;gCAC3BC,aAAW;gCACXhB,WAAU;;;;kCAIhB,KAACV;kCAAgB2B,gBAAgBX,WAAWS,QAAQ;;;;0BAGtD,MAAC1B;;kCACC,KAACE;wBAAesB,OAAO;kCACrB,cAAA,KAACD;4BAAKJ,KAAKC;4BAAST,WAAU;sCAC5B,cAAA,KAACR;gCAAK0B,IAAG;gCAAOC,MAAK;gCAAKC,IAAI;0CAC3Bd,WAAWK,WAAW;;;;oBAI5BD,4BAAc,KAACpB;kCAAgBgB,WAAWK,WAAW;yBAAqB;;;;;AAInF;AAEA,SAASM,gBAAgBF,QAAgB;IACvC,OAAQA;QACN,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT;YACE,OAAOA;IACX;AACF"}

package/dist/components/installed-integrations-section.d.ts

@@ -1,14 +1,16 @@
-import type { IntegrationConnectionDto, ListIntegrationConnectionsResponseDto } from '@shipfox/api-integration-core-dto';
-import type { UseQueryResult } from '@tanstack/react-query';
+import { type IntegrationConnection } from '#core/models.js';
 interface InstalledIntegrationsSectionProps {
-    connectionsQuery: UseQueryResult<ListIntegrationConnectionsResponseDto, Error>;
-    connections: IntegrationConnectionDto[];
+    connections: IntegrationConnection[];
+    isPending: boolean;
+    isFetching: boolean;
+    error?: Error | null | undefined;
+    onRetry: () => void;
     isMutating: boolean;
     onUse: (connectionId: string) => void;
-    onSetActive: (connection: IntegrationConnectionDto, active: boolean) => void;
+    onSetActive: (connection: IntegrationConnection, active: boolean) => void;
     onDelete: (connectionId: string) => void;
     providerDisplayName: (provider: string) => string | undefined;
 }
-export declare function InstalledIntegrationsSection({ connectionsQuery, connections, isMutating, onUse, onSetActive, onDelete, providerDisplayName, }: InstalledIntegrationsSectionProps): import("react").JSX.Element;
+export declare function InstalledIntegrationsSection({ connections, isPending, isFetching, error, onRetry, isMutating, onUse, onSetActive, onDelete, providerDisplayName, }: InstalledIntegrationsSectionProps): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=installed-integrations-section.d.ts.map

package/dist/components/installed-integrations-section.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"installed-integrations-section.d.ts","sourceRoot":"","sources":["../../src/components/installed-integrations-section.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,wBAAwB,EACxB,qCAAqC,EACtC,MAAM,mCAAmC,CAAC;AAc3C,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,uBAAuB,CAAC;AAM1D,UAAU,iCAAiC;IACzC,gBAAgB,EAAE,cAAc,CAAC,qCAAqC,EAAE,KAAK,CAAC,CAAC;IAC/E,WAAW,EAAE,wBAAwB,EAAE,CAAC;IACxC,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,WAAW,EAAE,CAAC,UAAU,EAAE,wBAAwB,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7E,QAAQ,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;CAC/D;AAKD,wBAAgB,4BAA4B,CAAC,EAC3C,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,KAAK,EACL,WAAW,EACX,QAAQ,EACR,mBAAmB,GACpB,EAAE,iCAAiC,+BA6CnC"}
+{"version":3,"file":"installed-integrations-section.d.ts","sourceRoot":"","sources":["../../src/components/installed-integrations-section.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAC,KAAK,qBAAqB,EAAqB,MAAM,iBAAiB,CAAC;AAG/E,UAAU,iCAAiC;IACzC,WAAW,EAAE,qBAAqB,EAAE,CAAC;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC;IACjC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,WAAW,EAAE,CAAC,UAAU,EAAE,qBAAqB,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC1E,QAAQ,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;CAC/D;AAKD,wBAAgB,4BAA4B,CAAC,EAC3C,WAAW,EACX,SAAS,EACT,UAAU,EACV,KAAK,EACL,OAAO,EACP,UAAU,EACV,KAAK,EACL,WAAW,EACX,QAAQ,EACR,mBAAmB,GACpB,EAAE,iCAAiC,+BAgDnC"}

package/dist/components/installed-integrations-section.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { QueryLoadError } from '@shipfox/client-ui';
+import { IntegrationIcon } from '@shipfox/integration-icons';
 import { IconButton } from '@shipfox/react-ui/button';
 import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from '@shipfox/react-ui/dropdown-menu';
 import { EmptyState } from '@shipfox/react-ui/empty-state';
@@ -8,10 +9,10 @@ import { Header, Text } from '@shipfox/react-ui/typography';
 import { cn, formatDate } from '@shipfox/react-ui/utils';
 import { Link } from '@tanstack/react-router';
 import { ConnectionStatusBadge } from '#connection-status-badge.js';
-import { IntegrationIcon } from '#integration-icon.js';
+import { isUsableConnection } from '#core/models.js';
 import { usageEventsForConnection } from './integration-usage-events.js';
 const INSTALLED_SURFACE_CLASS = 'overflow-hidden rounded-8 border border-border-neutral-base bg-background-neutral-base';
-export function InstalledIntegrationsSection({ connectionsQuery, connections, isMutating, onUse, onSetActive, onDelete, providerDisplayName }) {
+export function InstalledIntegrationsSection({ connections, isPending, isFetching, error, onRetry, isMutating, onUse, onSetActive, onDelete, providerDisplayName }) {
     return /*#__PURE__*/ _jsxs("section", {
         className: "flex flex-col gap-16",
         "aria-label": "Installed integrations",
@@ -30,17 +31,23 @@ export function InstalledIntegrationsSection({ connectionsQuery, connections, is
                     })
                 ]
             }),
-            connectionsQuery.isPending ? /*#__PURE__*/ _jsx(InstalledSkeleton, {
+            isPending ? /*#__PURE__*/ _jsx(InstalledSkeleton, {
                 label: "Loading integrations"
             }) : null,
-            connectionsQuery.isError && connectionsQuery.data === undefined ? /*#__PURE__*/ _jsx("div", {
+            error ? /*#__PURE__*/ _jsx("div", {
                 className: cn(INSTALLED_SURFACE_CLASS, 'px-16'),
                 children: /*#__PURE__*/ _jsx(QueryLoadError, {
-                    query: connectionsQuery,
+                    query: {
+                        isError: true,
+                        isFetching,
+                        data: undefined,
+                        error,
+                        refetch: onRetry
+                    },
                     subject: "integrations"
                 })
             }) : null,
-            connectionsQuery.data !== undefined && connections.length === 0 ? /*#__PURE__*/ _jsx("div", {
+            !isPending && !error && connections.length === 0 ? /*#__PURE__*/ _jsx("div", {
                 className: cn(INSTALLED_SURFACE_CLASS, 'px-16'),
                 children: /*#__PURE__*/ _jsx(EmptyState, {
                     icon: "componentLine",
@@ -63,8 +70,8 @@ export function InstalledIntegrationsSection({ connectionsQuery, connections, is
     });
 }
 function InstalledRow({ connection, isMutating, onUse, onSetActive, onDelete, providerDisplayName }) {
-    const muted = connection.lifecycle_status === 'disabled';
-    const active = connection.lifecycle_status === 'active';
+    const muted = connection.lifecycleStatus === 'disabled';
+    const active = isUsableConnection(connection);
     const recentEventsEvent = usageEventsForConnection(connection)[0]?.value ?? 'received';
     const providerName = providerDisplayName(connection.provider);
     return /*#__PURE__*/ _jsxs("li", {
@@ -85,10 +92,10 @@ function InstalledRow({ connection, isMutating, onUse, onSetActive, onDelete, pr
                                 size: "md",
                                 bold: true,
                                 className: cn('truncate', muted ? 'text-foreground-neutral-disabled' : undefined),
-                                children: connection.display_name
+                                children: connection.displayName
                             }),
                             /*#__PURE__*/ _jsx(ConnectionStatusBadge, {
-                                status: connection.lifecycle_status,
+                                status: connection.lifecycleStatus,
                                 className: "shrink-0"
                             })
                         ]
@@ -98,7 +105,7 @@ function InstalledRow({ connection, isMutating, onUse, onSetActive, onDelete, pr
                         className: "truncate text-foreground-neutral-muted",
                         children: [
                             "Added ",
-                            formatDate(connection.created_at)
+                            formatDate(connection.createdAt)
                         ]
                     })
                 ]
@@ -111,16 +118,16 @@ function InstalledRow({ connection, isMutating, onUse, onSetActive, onDelete, pr
                             size: "sm",
                             variant: "transparent",
                             icon: "more2Line",
-                            "aria-label": `Open ${connection.display_name} integration actions`
+                            "aria-label": `Open ${connection.displayName} integration actions`
                         })
                     }),
                     /*#__PURE__*/ _jsxs(DropdownMenuContent, {
                         align: "end",
                         children: [
-                            connection.external_url ? /*#__PURE__*/ _jsx(DropdownMenuItem, {
+                            connection.externalUrl ? /*#__PURE__*/ _jsx(DropdownMenuItem, {
                                 asChild: true,
                                 children: /*#__PURE__*/ _jsx("a", {
-                                    href: connection.external_url,
+                                    href: connection.externalUrl,
                                     target: "_blank",
                                     rel: "noreferrer noopener",
                                     children: providerName ? `Open in ${providerName}` : 'Open provider settings'
@@ -135,7 +142,7 @@ function InstalledRow({ connection, isMutating, onUse, onSetActive, onDelete, pr
                                 children: /*#__PURE__*/ _jsx(Link, {
                                     to: "/workspaces/$wid/settings/events",
                                     params: {
-                                        wid: connection.workspace_id
+                                        wid: connection.workspaceId
                                     },
                                     search: {
                                         source: [

package/dist/components/installed-integrations-section.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/installed-integrations-section.tsx"],"sourcesContent":["import type {\n  IntegrationConnectionDto,\n  ListIntegrationConnectionsResponseDto,\n} from '@shipfox/api-integration-core-dto';\nimport {QueryLoadError} from '@shipfox/client-ui';\nimport {IconButton} from '@shipfox/react-ui/button';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from '@shipfox/react-ui/dropdown-menu';\nimport {EmptyState} from '@shipfox/react-ui/empty-state';\nimport {Skeleton} from '@shipfox/react-ui/skeleton';\nimport {Header, Text} from '@shipfox/react-ui/typography';\nimport {cn, formatDate} from '@shipfox/react-ui/utils';\nimport type {UseQueryResult} from '@tanstack/react-query';\nimport {Link} from '@tanstack/react-router';\nimport {ConnectionStatusBadge} from '#connection-status-badge.js';\nimport {IntegrationIcon} from '#integration-icon.js';\nimport {usageEventsForConnection} from './integration-usage-events.js';\n\ninterface InstalledIntegrationsSectionProps {\n  connectionsQuery: UseQueryResult<ListIntegrationConnectionsResponseDto, Error>;\n  connections: IntegrationConnectionDto[];\n  isMutating: boolean;\n  onUse: (connectionId: string) => void;\n  onSetActive: (connection: IntegrationConnectionDto, active: boolean) => void;\n  onDelete: (connectionId: string) => void;\n  providerDisplayName: (provider: string) => string | undefined;\n}\n\nconst INSTALLED_SURFACE_CLASS =\n  'overflow-hidden rounded-8 border border-border-neutral-base bg-background-neutral-base';\n\nexport function InstalledIntegrationsSection({\n  connectionsQuery,\n  connections,\n  isMutating,\n  onUse,\n  onSetActive,\n  onDelete,\n  providerDisplayName,\n}: InstalledIntegrationsSectionProps) {\n  return (\n    <section className=\"flex flex-col gap-16\" aria-label=\"Installed integrations\">\n      <div className=\"flex flex-col gap-4\">\n        <Header variant=\"h3\">Installed integrations</Header>\n        <Text size=\"sm\" className=\"text-foreground-neutral-muted\">\n          Provider accounts installed in this workspace.\n        </Text>\n      </div>\n\n      {connectionsQuery.isPending ? <InstalledSkeleton label=\"Loading integrations\" /> : null}\n\n      {connectionsQuery.isError && connectionsQuery.data === undefined ? (\n        <div className={cn(INSTALLED_SURFACE_CLASS, 'px-16')}>\n          <QueryLoadError query={connectionsQuery} subject=\"integrations\" />\n        </div>\n      ) : null}\n\n      {connectionsQuery.data !== undefined && connections.length === 0 ? (\n        <div className={cn(INSTALLED_SURFACE_CLASS, 'px-16')}>\n          <EmptyState\n            icon=\"componentLine\"\n            title=\"No integrations installed yet\"\n            description=\"Install a provider below to get started.\"\n          />\n        </div>\n      ) : null}\n\n      {connections.length > 0 ? (\n        <ul className={cn('divide-y divide-border-neutral-base', INSTALLED_SURFACE_CLASS)}>\n          {connections.map((connection) => (\n            <InstalledRow\n              key={connection.id}\n              connection={connection}\n              isMutating={isMutating}\n              onUse={onUse}\n              onSetActive={(nextActive) => onSetActive(connection, nextActive)}\n              onDelete={onDelete}\n              providerDisplayName={providerDisplayName}\n            />\n          ))}\n        </ul>\n      ) : null}\n    </section>\n  );\n}\n\nfunction InstalledRow({\n  connection,\n  isMutating,\n  onUse,\n  onSetActive,\n  onDelete,\n  providerDisplayName,\n}: {\n  connection: IntegrationConnectionDto;\n  isMutating: boolean;\n  onUse: (connectionId: string) => void;\n  onSetActive: (active: boolean) => void;\n  onDelete: (connectionId: string) => void;\n  providerDisplayName: (provider: string) => string | undefined;\n}) {\n  const muted = connection.lifecycle_status === 'disabled';\n  const active = connection.lifecycle_status === 'active';\n  const recentEventsEvent = usageEventsForConnection(connection)[0]?.value ?? 'received';\n  const providerName = providerDisplayName(connection.provider);\n\n  return (\n    <li className=\"flex items-center gap-12 px-16 py-12 transition-colors hover:bg-background-components-hover\">\n      <IntegrationIcon\n        source={connection.provider}\n        aria-hidden\n        className={cn(\n          'size-24 shrink-0',\n          muted ? 'text-foreground-neutral-disabled' : 'text-foreground-neutral-base',\n        )}\n      />\n      <div className=\"flex min-w-0 flex-1 flex-col gap-2\">\n        <div className=\"flex min-w-0 items-center gap-8\">\n          <Text\n            size=\"md\"\n            bold\n            className={cn('truncate', muted ? 'text-foreground-neutral-disabled' : undefined)}\n          >\n            {connection.display_name}\n          </Text>\n          <ConnectionStatusBadge status={connection.lifecycle_status} className=\"shrink-0\" />\n        </div>\n        <Text size=\"sm\" className=\"truncate text-foreground-neutral-muted\">\n          Added {formatDate(connection.created_at)}\n        </Text>\n      </div>\n      <DropdownMenu>\n        <DropdownMenuTrigger asChild>\n          <IconButton\n            size=\"sm\"\n            variant=\"transparent\"\n            icon=\"more2Line\"\n            aria-label={`Open ${connection.display_name} integration actions`}\n          />\n        </DropdownMenuTrigger>\n        <DropdownMenuContent align=\"end\">\n          {connection.external_url ? (\n            <DropdownMenuItem asChild>\n              <a href={connection.external_url} target=\"_blank\" rel=\"noreferrer noopener\">\n                {providerName ? `Open in ${providerName}` : 'Open provider settings'}\n              </a>\n            </DropdownMenuItem>\n          ) : null}\n          <DropdownMenuItem onSelect={() => onUse(connection.id)}>\n            Use this integration\n          </DropdownMenuItem>\n          <DropdownMenuItem asChild>\n            <Link\n              to=\"/workspaces/$wid/settings/events\"\n              params={{wid: connection.workspace_id}}\n              search={{source: [connection.slug], event: [recentEventsEvent]}}\n            >\n              View recent events\n            </Link>\n          </DropdownMenuItem>\n          <DropdownMenuSeparator />\n          <DropdownMenuItem disabled={isMutating} onSelect={() => onSetActive(!active)}>\n            {active ? 'Disable integration' : 'Enable integration'}\n          </DropdownMenuItem>\n          <DropdownMenuItem disabled={isMutating} onSelect={() => onDelete(connection.id)}>\n            Delete integration\n          </DropdownMenuItem>\n        </DropdownMenuContent>\n      </DropdownMenu>\n    </li>\n  );\n}\n\nfunction InstalledSkeleton({label}: {label: string}) {\n  return (\n    <ul\n      role=\"status\"\n      aria-label={label}\n      className={cn('divide-y divide-border-neutral-base', INSTALLED_SURFACE_CLASS)}\n    >\n      {[0, 1, 2].map((row) => (\n        <li key={row} className=\"flex items-center gap-12 px-16 py-12\">\n          <Skeleton className=\"size-24 shrink-0\" />\n          <div className=\"flex min-w-0 flex-1 flex-col gap-2\">\n            <Skeleton className=\"h-16 w-120\" />\n            <Skeleton className=\"h-12 w-80\" />\n          </div>\n          <Skeleton className=\"h-20 w-72 shrink-0\" />\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"names":["QueryLoadError","IconButton","DropdownMenu","DropdownMenuContent","DropdownMenuItem","DropdownMenuSeparator","DropdownMenuTrigger","EmptyState","Skeleton","Header","Text","cn","formatDate","Link","ConnectionStatusBadge","IntegrationIcon","usageEventsForConnection","INSTALLED_SURFACE_CLASS","InstalledIntegrationsSection","connectionsQuery","connections","isMutating","onUse","onSetActive","onDelete","providerDisplayName","section","className","aria-label","div","variant","size","isPending","InstalledSkeleton","label","isError","data","undefined","query","subject","length","icon","title","description","ul","map","connection","InstalledRow","nextActive","id","muted","lifecycle_status","active","recentEventsEvent","value","providerName","provider","li","source","aria-hidden","bold","display_name","status","created_at","asChild","align","external_url","a","href","target","rel","onSelect","to","params","wid","workspace_id","search","slug","event","disabled","role","row"],"mappings":"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"}
+{"version":3,"sources":["../../src/components/installed-integrations-section.tsx"],"sourcesContent":["import {QueryLoadError} from '@shipfox/client-ui';\nimport {IntegrationIcon} from '@shipfox/integration-icons';\nimport {IconButton} from '@shipfox/react-ui/button';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from '@shipfox/react-ui/dropdown-menu';\nimport {EmptyState} from '@shipfox/react-ui/empty-state';\nimport {Skeleton} from '@shipfox/react-ui/skeleton';\nimport {Header, Text} from '@shipfox/react-ui/typography';\nimport {cn, formatDate} from '@shipfox/react-ui/utils';\nimport {Link} from '@tanstack/react-router';\nimport {ConnectionStatusBadge} from '#connection-status-badge.js';\nimport {type IntegrationConnection, isUsableConnection} from '#core/models.js';\nimport {usageEventsForConnection} from './integration-usage-events.js';\n\ninterface InstalledIntegrationsSectionProps {\n  connections: IntegrationConnection[];\n  isPending: boolean;\n  isFetching: boolean;\n  error?: Error | null | undefined;\n  onRetry: () => void;\n  isMutating: boolean;\n  onUse: (connectionId: string) => void;\n  onSetActive: (connection: IntegrationConnection, active: boolean) => void;\n  onDelete: (connectionId: string) => void;\n  providerDisplayName: (provider: string) => string | undefined;\n}\n\nconst INSTALLED_SURFACE_CLASS =\n  'overflow-hidden rounded-8 border border-border-neutral-base bg-background-neutral-base';\n\nexport function InstalledIntegrationsSection({\n  connections,\n  isPending,\n  isFetching,\n  error,\n  onRetry,\n  isMutating,\n  onUse,\n  onSetActive,\n  onDelete,\n  providerDisplayName,\n}: InstalledIntegrationsSectionProps) {\n  return (\n    <section className=\"flex flex-col gap-16\" aria-label=\"Installed integrations\">\n      <div className=\"flex flex-col gap-4\">\n        <Header variant=\"h3\">Installed integrations</Header>\n        <Text size=\"sm\" className=\"text-foreground-neutral-muted\">\n          Provider accounts installed in this workspace.\n        </Text>\n      </div>\n\n      {isPending ? <InstalledSkeleton label=\"Loading integrations\" /> : null}\n\n      {error ? (\n        <div className={cn(INSTALLED_SURFACE_CLASS, 'px-16')}>\n          <QueryLoadError\n            query={{isError: true, isFetching, data: undefined, error, refetch: onRetry}}\n            subject=\"integrations\"\n          />\n        </div>\n      ) : null}\n\n      {!isPending && !error && connections.length === 0 ? (\n        <div className={cn(INSTALLED_SURFACE_CLASS, 'px-16')}>\n          <EmptyState\n            icon=\"componentLine\"\n            title=\"No integrations installed yet\"\n            description=\"Install a provider below to get started.\"\n          />\n        </div>\n      ) : null}\n\n      {connections.length > 0 ? (\n        <ul className={cn('divide-y divide-border-neutral-base', INSTALLED_SURFACE_CLASS)}>\n          {connections.map((connection) => (\n            <InstalledRow\n              key={connection.id}\n              connection={connection}\n              isMutating={isMutating}\n              onUse={onUse}\n              onSetActive={(nextActive) => onSetActive(connection, nextActive)}\n              onDelete={onDelete}\n              providerDisplayName={providerDisplayName}\n            />\n          ))}\n        </ul>\n      ) : null}\n    </section>\n  );\n}\n\nfunction InstalledRow({\n  connection,\n  isMutating,\n  onUse,\n  onSetActive,\n  onDelete,\n  providerDisplayName,\n}: {\n  connection: IntegrationConnection;\n  isMutating: boolean;\n  onUse: (connectionId: string) => void;\n  onSetActive: (active: boolean) => void;\n  onDelete: (connectionId: string) => void;\n  providerDisplayName: (provider: string) => string | undefined;\n}) {\n  const muted = connection.lifecycleStatus === 'disabled';\n  const active = isUsableConnection(connection);\n  const recentEventsEvent = usageEventsForConnection(connection)[0]?.value ?? 'received';\n  const providerName = providerDisplayName(connection.provider);\n\n  return (\n    <li className=\"flex items-center gap-12 px-16 py-12 transition-colors hover:bg-background-components-hover\">\n      <IntegrationIcon\n        source={connection.provider}\n        aria-hidden\n        className={cn(\n          'size-24 shrink-0',\n          muted ? 'text-foreground-neutral-disabled' : 'text-foreground-neutral-base',\n        )}\n      />\n      <div className=\"flex min-w-0 flex-1 flex-col gap-2\">\n        <div className=\"flex min-w-0 items-center gap-8\">\n          <Text\n            size=\"md\"\n            bold\n            className={cn('truncate', muted ? 'text-foreground-neutral-disabled' : undefined)}\n          >\n            {connection.displayName}\n          </Text>\n          <ConnectionStatusBadge status={connection.lifecycleStatus} className=\"shrink-0\" />\n        </div>\n        <Text size=\"sm\" className=\"truncate text-foreground-neutral-muted\">\n          Added {formatDate(connection.createdAt)}\n        </Text>\n      </div>\n      <DropdownMenu>\n        <DropdownMenuTrigger asChild>\n          <IconButton\n            size=\"sm\"\n            variant=\"transparent\"\n            icon=\"more2Line\"\n            aria-label={`Open ${connection.displayName} integration actions`}\n          />\n        </DropdownMenuTrigger>\n        <DropdownMenuContent align=\"end\">\n          {connection.externalUrl ? (\n            <DropdownMenuItem asChild>\n              <a href={connection.externalUrl} target=\"_blank\" rel=\"noreferrer noopener\">\n                {providerName ? `Open in ${providerName}` : 'Open provider settings'}\n              </a>\n            </DropdownMenuItem>\n          ) : null}\n          <DropdownMenuItem onSelect={() => onUse(connection.id)}>\n            Use this integration\n          </DropdownMenuItem>\n          <DropdownMenuItem asChild>\n            <Link\n              to=\"/workspaces/$wid/settings/events\"\n              params={{wid: connection.workspaceId}}\n              search={{source: [connection.slug], event: [recentEventsEvent]}}\n            >\n              View recent events\n            </Link>\n          </DropdownMenuItem>\n          <DropdownMenuSeparator />\n          <DropdownMenuItem disabled={isMutating} onSelect={() => onSetActive(!active)}>\n            {active ? 'Disable integration' : 'Enable integration'}\n          </DropdownMenuItem>\n          <DropdownMenuItem disabled={isMutating} onSelect={() => onDelete(connection.id)}>\n            Delete integration\n          </DropdownMenuItem>\n        </DropdownMenuContent>\n      </DropdownMenu>\n    </li>\n  );\n}\n\nfunction InstalledSkeleton({label}: {label: string}) {\n  return (\n    <ul\n      role=\"status\"\n      aria-label={label}\n      className={cn('divide-y divide-border-neutral-base', INSTALLED_SURFACE_CLASS)}\n    >\n      {[0, 1, 2].map((row) => (\n        <li key={row} className=\"flex items-center gap-12 px-16 py-12\">\n          <Skeleton className=\"size-24 shrink-0\" />\n          <div className=\"flex min-w-0 flex-1 flex-col gap-2\">\n            <Skeleton className=\"h-16 w-120\" />\n            <Skeleton className=\"h-12 w-80\" />\n          </div>\n          <Skeleton className=\"h-20 w-72 shrink-0\" />\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"names":["QueryLoadError","IntegrationIcon","IconButton","DropdownMenu","DropdownMenuContent","DropdownMenuItem","DropdownMenuSeparator","DropdownMenuTrigger","EmptyState","Skeleton","Header","Text","cn","formatDate","Link","ConnectionStatusBadge","isUsableConnection","usageEventsForConnection","INSTALLED_SURFACE_CLASS","InstalledIntegrationsSection","connections","isPending","isFetching","error","onRetry","isMutating","onUse","onSetActive","onDelete","providerDisplayName","section","className","aria-label","div","variant","size","InstalledSkeleton","label","query","isError","data","undefined","refetch","subject","length","icon","title","description","ul","map","connection","InstalledRow","nextActive","id","muted","lifecycleStatus","active","recentEventsEvent","value","providerName","provider","li","source","aria-hidden","bold","displayName","status","createdAt","asChild","align","externalUrl","a","href","target","rel","onSelect","to","params","wid","workspaceId","search","slug","event","disabled","role","row"],"mappings":"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"}

package/dist/components/integration-gallery-for-workspace.d.ts

@@ -1,6 +1,6 @@
-import type { IntegrationCapabilityDto } from '@shipfox/api-integration-core-dto';
+import type { IntegrationCapability } from '#core/models.js';
 interface IntegrationGalleryForWorkspaceProps {
-    capability: IntegrationCapabilityDto | undefined;
+    capability: IntegrationCapability | undefined;
     emptyProvidersMessage: string;
     workspaceId: string;
 }

package/dist/components/integration-gallery-for-workspace.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"integration-gallery-for-workspace.d.ts","sourceRoot":"","sources":["../../src/components/integration-gallery-for-workspace.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,wBAAwB,EAGzB,MAAM,mCAAmC,CAAC;AAsB3C,UAAU,mCAAmC;IAC3C,UAAU,EAAE,wBAAwB,GAAG,SAAS,CAAC;IACjD,qBAAqB,EAAE,MAAM,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,8BAA8B,CAAC,EAC7C,UAAU,EACV,qBAAqB,EACrB,WAAW,GACZ,EAAE,mCAAmC,+BA4JrC"}
+{"version":3,"file":"integration-gallery-for-workspace.d.ts","sourceRoot":"","sources":["../../src/components/integration-gallery-for-workspace.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,qBAAqB,EAGtB,MAAM,iBAAiB,CAAC;AAmBzB,UAAU,mCAAmC;IAC3C,UAAU,EAAE,qBAAqB,GAAG,SAAS,CAAC;IAC9C,qBAAqB,EAAE,MAAM,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,8BAA8B,CAAC,EAC7C,UAAU,EACV,qBAAqB,EACrB,WAAW,GACZ,EAAE,mCAAmC,+BAmKrC"}

package/dist/components/integration-gallery-for-workspace.js

@@ -24,24 +24,24 @@ export function IntegrationGalleryForWorkspace({ capability, emptyProvidersMessa
     const deleteConnection = useDeleteIntegrationConnectionMutation();
     const updateWebhookConnection = useUpdateWebhookConnectionMutation();
     const deleteWebhookConnection = useDeleteWebhookConnectionMutation();
-    const providers = providersQuery.data?.providers ?? [];
+    const providers = providersQuery.data ?? [];
     const providersMap = new Map(providers.map((provider)=>[
             provider.provider,
             provider
         ]));
-    const allConnections = connectionsQuery.data?.connections ?? [];
+    const allConnections = connectionsQuery.data ?? [];
     // Filter in memory so the all-status cache key stays shared; passing capability
     // into the hook would collide with the active-only `source_control` key used
     // elsewhere.
     const connections = capability ? allConnections.filter((connection)=>connection.capabilities.includes(capability)) : allConnections;
-    const providerDisplayName = (provider)=>providersMap.get(provider)?.display_name;
+    const providerDisplayName = (provider)=>providersMap.get(provider)?.displayName;
     const providerLabel = (provider)=>providerDisplayName(provider) ?? provider;
     const sortedConnections = [
         ...connections
     ].sort((a, b)=>{
         const byProvider = providerLabel(a.provider).localeCompare(providerLabel(b.provider));
         if (byProvider !== 0) return byProvider;
-        return a.created_at.localeCompare(b.created_at);
+        return a.createdAt.localeCompare(b.createdAt);
     });
     const usageConnection = sortedConnections.find((connection)=>connection.id === usageConnectionId) ?? (createdUsageConnection?.id === usageConnectionId ? createdUsageConnection : null) ?? null;
     const deleteConnectionTarget = sortedConnections.find((connection)=>connection.id === deleteConnectionId);
@@ -91,8 +91,11 @@ export function IntegrationGalleryForWorkspace({ capability, emptyProvidersMessa
         className: "flex flex-col gap-24",
         children: [
             /*#__PURE__*/ _jsx(InstalledIntegrationsSection, {
-                connectionsQuery: connectionsQuery,
                 connections: sortedConnections,
+                isPending: connectionsQuery.isPending,
+                isFetching: connectionsQuery.isFetching,
+                error: connectionsQuery.isError ? connectionsQuery.error : undefined,
+                onRetry: ()=>void connectionsQuery.refetch(),
                 isMutating: updateConnection.isPending || deleteConnection.isPending || updateWebhookConnection.isPending || deleteWebhookConnection.isPending,
                 onUse: setUsageConnectionId,
                 onSetActive: (connection, active)=>{
@@ -120,7 +123,11 @@ export function IntegrationGalleryForWorkspace({ capability, emptyProvidersMessa
                         ]
                     }),
                     /*#__PURE__*/ _jsx(ProviderGrid, {
-                        providersQuery: providersQuery,
+                        providers: providers,
+                        isPending: providersQuery.isPending,
+                        isFetching: providersQuery.isFetching,
+                        error: providersQuery.isError ? providersQuery.error : undefined,
+                        onRetry: ()=>void providersQuery.refetch(),
                         workspaceId: workspaceId,
                         emptyMessage: emptyProvidersMessage,
                         onOpenProvider: setCreateProvider
@@ -152,7 +159,7 @@ export function IntegrationGalleryForWorkspace({ capability, emptyProvidersMessa
                 }) : null
             }),
             /*#__PURE__*/ _jsx(IntegrationDeleteConfirmModal, {
-                connectionName: deleteConnectionTarget?.display_name,
+                connectionName: deleteConnectionTarget?.displayName,
                 open: deleteConnectionId !== undefined,
                 isPending: deleteConnection.isPending || deleteWebhookConnection.isPending,
                 onOpenChange: (open)=>{

package/dist/components/integration-gallery-for-workspace.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/integration-gallery-for-workspace.tsx"],"sourcesContent":["import type {\n  IntegrationCapabilityDto,\n  IntegrationConnectionDto,\n  IntegrationProviderDto,\n} from '@shipfox/api-integration-core-dto';\nimport {toast} from '@shipfox/react-ui/toast';\nimport {Header, Text} from '@shipfox/react-ui/typography';\nimport {useState} from 'react';\nimport {\n  useDeleteIntegrationConnectionMutation,\n  useIntegrationConnectionsQuery,\n  useIntegrationProvidersQuery,\n  useUpdateIntegrationConnectionMutation,\n} from '#hooks/api/integrations.js';\nimport {\n  useDeleteWebhookConnectionMutation,\n  useUpdateWebhookConnectionMutation,\n} from '#hooks/api/webhook-connections.js';\nimport {InstalledIntegrationsSection} from './installed-integrations-section.js';\nimport {IntegrationDeleteConfirmModal} from './integration-delete-confirm-modal.js';\nimport {usageEventsForConnection} from './integration-usage-events.js';\nimport {IntegrationUsageModal} from './integration-usage-modal.js';\nimport {ProviderGrid} from './provider-grid.js';\nimport {WebhookCreateModal} from './webhook/webhook-create-modal.js';\nimport {WebhookUsageDetails} from './webhook/webhook-usage-details.js';\n\ninterface IntegrationGalleryForWorkspaceProps {\n  capability: IntegrationCapabilityDto | undefined;\n  emptyProvidersMessage: string;\n  workspaceId: string;\n}\n\nexport function IntegrationGalleryForWorkspace({\n  capability,\n  emptyProvidersMessage,\n  workspaceId,\n}: IntegrationGalleryForWorkspaceProps) {\n  const [createProvider, setCreateProvider] = useState<string | undefined>();\n  const [usageConnectionId, setUsageConnectionId] = useState<string | undefined>();\n  const [createdUsageConnection, setCreatedUsageConnection] = useState<\n    IntegrationConnectionDto | undefined\n  >();\n  const [deleteConnectionId, setDeleteConnectionId] = useState<string | undefined>();\n  const providersQuery = useIntegrationProvidersQuery(capability ? {capability} : undefined);\n  const connectionsQuery = useIntegrationConnectionsQuery(workspaceId);\n  const updateConnection = useUpdateIntegrationConnectionMutation();\n  const deleteConnection = useDeleteIntegrationConnectionMutation();\n  const updateWebhookConnection = useUpdateWebhookConnectionMutation();\n  const deleteWebhookConnection = useDeleteWebhookConnectionMutation();\n\n  const providers = providersQuery.data?.providers ?? [];\n  const providersMap = new Map<string, IntegrationProviderDto>(\n    providers.map((provider) => [provider.provider, provider]),\n  );\n\n  const allConnections = connectionsQuery.data?.connections ?? [];\n  // Filter in memory so the all-status cache key stays shared; passing capability\n  // into the hook would collide with the active-only `source_control` key used\n  // elsewhere.\n  const connections = capability\n    ? allConnections.filter((connection) => connection.capabilities.includes(capability))\n    : allConnections;\n\n  const providerDisplayName = (provider: string) => providersMap.get(provider)?.display_name;\n  const providerLabel = (provider: string) => providerDisplayName(provider) ?? provider;\n\n  const sortedConnections = [...connections].sort((a, b) => {\n    const byProvider = providerLabel(a.provider).localeCompare(providerLabel(b.provider));\n    if (byProvider !== 0) return byProvider;\n    return a.created_at.localeCompare(b.created_at);\n  });\n  const usageConnection =\n    sortedConnections.find((connection) => connection.id === usageConnectionId) ??\n    (createdUsageConnection?.id === usageConnectionId ? createdUsageConnection : null) ??\n    null;\n  const deleteConnectionTarget = sortedConnections.find(\n    (connection) => connection.id === deleteConnectionId,\n  );\n\n  async function setConnectionActive(connection: IntegrationConnectionDto, active: boolean) {\n    try {\n      const body = {lifecycle_status: active ? 'active' : 'disabled'} as const;\n      if (connection.provider === 'webhook') {\n        await updateWebhookConnection.mutateAsync({\n          workspaceId,\n          connectionId: connection.id,\n          body,\n        });\n      } else {\n        await updateConnection.mutateAsync({\n          connectionId: connection.id,\n          body,\n        });\n      }\n      toast.success(active ? 'Integration enabled.' : 'Integration disabled.');\n    } catch (error) {\n      toast.error(error instanceof Error ? error.message : 'Could not update integration.');\n    }\n  }\n\n  async function confirmDeleteConnection() {\n    if (!deleteConnectionTarget) return;\n    try {\n      if (deleteConnectionTarget.provider === 'webhook') {\n        await deleteWebhookConnection.mutateAsync({\n          workspaceId,\n          connectionId: deleteConnectionTarget.id,\n        });\n      } else {\n        await deleteConnection.mutateAsync({\n          workspaceId,\n          connectionId: deleteConnectionTarget.id,\n        });\n      }\n      toast.success('Integration deleted.');\n      setDeleteConnectionId(undefined);\n    } catch (error) {\n      toast.error(error instanceof Error ? error.message : 'Could not delete integration.');\n    }\n  }\n\n  return (\n    <div className=\"flex flex-col gap-24\">\n      <InstalledIntegrationsSection\n        connectionsQuery={connectionsQuery}\n        connections={sortedConnections}\n        isMutating={\n          updateConnection.isPending ||\n          deleteConnection.isPending ||\n          updateWebhookConnection.isPending ||\n          deleteWebhookConnection.isPending\n        }\n        onUse={setUsageConnectionId}\n        onSetActive={(connection, active) => {\n          void setConnectionActive(connection, active);\n        }}\n        onDelete={setDeleteConnectionId}\n        providerDisplayName={providerDisplayName}\n      />\n\n      <section className=\"flex flex-col gap-16\" aria-label=\"Available integrations\">\n        <div className=\"flex flex-col gap-4\">\n          <Header variant=\"h3\">Available integrations</Header>\n          <Text size=\"sm\" className=\"text-foreground-neutral-muted\">\n            Providers available to install in this workspace.\n          </Text>\n        </div>\n\n        <ProviderGrid\n          providersQuery={providersQuery}\n          workspaceId={workspaceId}\n          emptyMessage={emptyProvidersMessage}\n          onOpenProvider={setCreateProvider}\n        />\n      </section>\n      <WebhookCreateModal\n        workspaceId={workspaceId}\n        open={createProvider === 'webhook'}\n        onOpenChange={(open) => setCreateProvider(open ? 'webhook' : undefined)}\n        onCreated={(connection) => {\n          setCreatedUsageConnection(connection);\n          setUsageConnectionId(connection.id);\n        }}\n      />\n      <IntegrationUsageModal\n        connection={usageConnection}\n        events={usageConnection ? usageEventsForConnection(usageConnection) : []}\n        open={usageConnection !== null}\n        onOpenChange={(open) => {\n          if (!open) {\n            setUsageConnectionId(undefined);\n            setCreatedUsageConnection(undefined);\n          }\n        }}\n      >\n        {usageConnection?.provider === 'webhook' ? (\n          <WebhookUsageDetails workspaceId={workspaceId} connectionId={usageConnection.id} />\n        ) : null}\n      </IntegrationUsageModal>\n      <IntegrationDeleteConfirmModal\n        connectionName={deleteConnectionTarget?.display_name}\n        open={deleteConnectionId !== undefined}\n        isPending={deleteConnection.isPending || deleteWebhookConnection.isPending}\n        onOpenChange={(open) => {\n          if (!open) setDeleteConnectionId(undefined);\n        }}\n        onConfirm={() => {\n          void confirmDeleteConnection();\n        }}\n      />\n    </div>\n  );\n}\n"],"names":["toast","Header","Text","useState","useDeleteIntegrationConnectionMutation","useIntegrationConnectionsQuery","useIntegrationProvidersQuery","useUpdateIntegrationConnectionMutation","useDeleteWebhookConnectionMutation","useUpdateWebhookConnectionMutation","InstalledIntegrationsSection","IntegrationDeleteConfirmModal","usageEventsForConnection","IntegrationUsageModal","ProviderGrid","WebhookCreateModal","WebhookUsageDetails","IntegrationGalleryForWorkspace","capability","emptyProvidersMessage","workspaceId","createProvider","setCreateProvider","usageConnectionId","setUsageConnectionId","createdUsageConnection","setCreatedUsageConnection","deleteConnectionId","setDeleteConnectionId","providersQuery","undefined","connectionsQuery","updateConnection","deleteConnection","updateWebhookConnection","deleteWebhookConnection","providers","data","providersMap","Map","map","provider","allConnections","connections","filter","connection","capabilities","includes","providerDisplayName","get","display_name","providerLabel","sortedConnections","sort","a","b","byProvider","localeCompare","created_at","usageConnection","find","id","deleteConnectionTarget","setConnectionActive","active","body","lifecycle_status","mutateAsync","connectionId","success","error","Error","message","confirmDeleteConnection","div","className","isMutating","isPending","onUse","onSetActive","onDelete","section","aria-label","variant","size","emptyMessage","onOpenProvider","open","onOpenChange","onCreated","events","connectionName","onConfirm"],"mappings":"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"}
+{"version":3,"sources":["../../src/components/integration-gallery-for-workspace.tsx"],"sourcesContent":["import {toast} from '@shipfox/react-ui/toast';\nimport {Header, Text} from '@shipfox/react-ui/typography';\nimport {useState} from 'react';\nimport type {\n  IntegrationCapability,\n  IntegrationConnection,\n  IntegrationProvider,\n} from '#core/models.js';\nimport {\n  useDeleteIntegrationConnectionMutation,\n  useIntegrationConnectionsQuery,\n  useIntegrationProvidersQuery,\n  useUpdateIntegrationConnectionMutation,\n} from '#hooks/api/integrations.js';\nimport {\n  useDeleteWebhookConnectionMutation,\n  useUpdateWebhookConnectionMutation,\n} from '#hooks/api/webhook-connections.js';\nimport {InstalledIntegrationsSection} from './installed-integrations-section.js';\nimport {IntegrationDeleteConfirmModal} from './integration-delete-confirm-modal.js';\nimport {usageEventsForConnection} from './integration-usage-events.js';\nimport {IntegrationUsageModal} from './integration-usage-modal.js';\nimport {ProviderGrid} from './provider-grid.js';\nimport {WebhookCreateModal} from './webhook/webhook-create-modal.js';\nimport {WebhookUsageDetails} from './webhook/webhook-usage-details.js';\n\ninterface IntegrationGalleryForWorkspaceProps {\n  capability: IntegrationCapability | undefined;\n  emptyProvidersMessage: string;\n  workspaceId: string;\n}\n\nexport function IntegrationGalleryForWorkspace({\n  capability,\n  emptyProvidersMessage,\n  workspaceId,\n}: IntegrationGalleryForWorkspaceProps) {\n  const [createProvider, setCreateProvider] = useState<string | undefined>();\n  const [usageConnectionId, setUsageConnectionId] = useState<string | undefined>();\n  const [createdUsageConnection, setCreatedUsageConnection] = useState<\n    IntegrationConnection | undefined\n  >();\n  const [deleteConnectionId, setDeleteConnectionId] = useState<string | undefined>();\n  const providersQuery = useIntegrationProvidersQuery(capability ? {capability} : undefined);\n  const connectionsQuery = useIntegrationConnectionsQuery(workspaceId);\n  const updateConnection = useUpdateIntegrationConnectionMutation();\n  const deleteConnection = useDeleteIntegrationConnectionMutation();\n  const updateWebhookConnection = useUpdateWebhookConnectionMutation();\n  const deleteWebhookConnection = useDeleteWebhookConnectionMutation();\n\n  const providers = providersQuery.data ?? [];\n  const providersMap = new Map<string, IntegrationProvider>(\n    providers.map((provider) => [provider.provider, provider]),\n  );\n\n  const allConnections = connectionsQuery.data ?? [];\n  // Filter in memory so the all-status cache key stays shared; passing capability\n  // into the hook would collide with the active-only `source_control` key used\n  // elsewhere.\n  const connections = capability\n    ? allConnections.filter((connection) => connection.capabilities.includes(capability))\n    : allConnections;\n\n  const providerDisplayName = (provider: string) => providersMap.get(provider)?.displayName;\n  const providerLabel = (provider: string) => providerDisplayName(provider) ?? provider;\n\n  const sortedConnections = [...connections].sort((a, b) => {\n    const byProvider = providerLabel(a.provider).localeCompare(providerLabel(b.provider));\n    if (byProvider !== 0) return byProvider;\n    return a.createdAt.localeCompare(b.createdAt);\n  });\n  const usageConnection =\n    sortedConnections.find((connection) => connection.id === usageConnectionId) ??\n    (createdUsageConnection?.id === usageConnectionId ? createdUsageConnection : null) ??\n    null;\n  const deleteConnectionTarget = sortedConnections.find(\n    (connection) => connection.id === deleteConnectionId,\n  );\n\n  async function setConnectionActive(connection: IntegrationConnection, active: boolean) {\n    try {\n      const body = {lifecycle_status: active ? 'active' : 'disabled'} as const;\n      if (connection.provider === 'webhook') {\n        await updateWebhookConnection.mutateAsync({\n          workspaceId,\n          connectionId: connection.id,\n          body,\n        });\n      } else {\n        await updateConnection.mutateAsync({\n          connectionId: connection.id,\n          body,\n        });\n      }\n      toast.success(active ? 'Integration enabled.' : 'Integration disabled.');\n    } catch (error) {\n      toast.error(error instanceof Error ? error.message : 'Could not update integration.');\n    }\n  }\n\n  async function confirmDeleteConnection() {\n    if (!deleteConnectionTarget) return;\n    try {\n      if (deleteConnectionTarget.provider === 'webhook') {\n        await deleteWebhookConnection.mutateAsync({\n          workspaceId,\n          connectionId: deleteConnectionTarget.id,\n        });\n      } else {\n        await deleteConnection.mutateAsync({\n          workspaceId,\n          connectionId: deleteConnectionTarget.id,\n        });\n      }\n      toast.success('Integration deleted.');\n      setDeleteConnectionId(undefined);\n    } catch (error) {\n      toast.error(error instanceof Error ? error.message : 'Could not delete integration.');\n    }\n  }\n\n  return (\n    <div className=\"flex flex-col gap-24\">\n      <InstalledIntegrationsSection\n        connections={sortedConnections}\n        isPending={connectionsQuery.isPending}\n        isFetching={connectionsQuery.isFetching}\n        error={connectionsQuery.isError ? connectionsQuery.error : undefined}\n        onRetry={() => void connectionsQuery.refetch()}\n        isMutating={\n          updateConnection.isPending ||\n          deleteConnection.isPending ||\n          updateWebhookConnection.isPending ||\n          deleteWebhookConnection.isPending\n        }\n        onUse={setUsageConnectionId}\n        onSetActive={(connection, active) => {\n          void setConnectionActive(connection, active);\n        }}\n        onDelete={setDeleteConnectionId}\n        providerDisplayName={providerDisplayName}\n      />\n\n      <section className=\"flex flex-col gap-16\" aria-label=\"Available integrations\">\n        <div className=\"flex flex-col gap-4\">\n          <Header variant=\"h3\">Available integrations</Header>\n          <Text size=\"sm\" className=\"text-foreground-neutral-muted\">\n            Providers available to install in this workspace.\n          </Text>\n        </div>\n\n        <ProviderGrid\n          providers={providers}\n          isPending={providersQuery.isPending}\n          isFetching={providersQuery.isFetching}\n          error={providersQuery.isError ? providersQuery.error : undefined}\n          onRetry={() => void providersQuery.refetch()}\n          workspaceId={workspaceId}\n          emptyMessage={emptyProvidersMessage}\n          onOpenProvider={setCreateProvider}\n        />\n      </section>\n      <WebhookCreateModal\n        workspaceId={workspaceId}\n        open={createProvider === 'webhook'}\n        onOpenChange={(open) => setCreateProvider(open ? 'webhook' : undefined)}\n        onCreated={(connection) => {\n          setCreatedUsageConnection(connection);\n          setUsageConnectionId(connection.id);\n        }}\n      />\n      <IntegrationUsageModal\n        connection={usageConnection}\n        events={usageConnection ? usageEventsForConnection(usageConnection) : []}\n        open={usageConnection !== null}\n        onOpenChange={(open) => {\n          if (!open) {\n            setUsageConnectionId(undefined);\n            setCreatedUsageConnection(undefined);\n          }\n        }}\n      >\n        {usageConnection?.provider === 'webhook' ? (\n          <WebhookUsageDetails workspaceId={workspaceId} connectionId={usageConnection.id} />\n        ) : null}\n      </IntegrationUsageModal>\n      <IntegrationDeleteConfirmModal\n        connectionName={deleteConnectionTarget?.displayName}\n        open={deleteConnectionId !== undefined}\n        isPending={deleteConnection.isPending || deleteWebhookConnection.isPending}\n        onOpenChange={(open) => {\n          if (!open) setDeleteConnectionId(undefined);\n        }}\n        onConfirm={() => {\n          void confirmDeleteConnection();\n        }}\n      />\n    </div>\n  );\n}\n"],"names":["toast","Header","Text","useState","useDeleteIntegrationConnectionMutation","useIntegrationConnectionsQuery","useIntegrationProvidersQuery","useUpdateIntegrationConnectionMutation","useDeleteWebhookConnectionMutation","useUpdateWebhookConnectionMutation","InstalledIntegrationsSection","IntegrationDeleteConfirmModal","usageEventsForConnection","IntegrationUsageModal","ProviderGrid","WebhookCreateModal","WebhookUsageDetails","IntegrationGalleryForWorkspace","capability","emptyProvidersMessage","workspaceId","createProvider","setCreateProvider","usageConnectionId","setUsageConnectionId","createdUsageConnection","setCreatedUsageConnection","deleteConnectionId","setDeleteConnectionId","providersQuery","undefined","connectionsQuery","updateConnection","deleteConnection","updateWebhookConnection","deleteWebhookConnection","providers","data","providersMap","Map","map","provider","allConnections","connections","filter","connection","capabilities","includes","providerDisplayName","get","displayName","providerLabel","sortedConnections","sort","a","b","byProvider","localeCompare","createdAt","usageConnection","find","id","deleteConnectionTarget","setConnectionActive","active","body","lifecycle_status","mutateAsync","connectionId","success","error","Error","message","confirmDeleteConnection","div","className","isPending","isFetching","isError","onRetry","refetch","isMutating","onUse","onSetActive","onDelete","section","aria-label","variant","size","emptyMessage","onOpenProvider","open","onOpenChange","onCreated","events","connectionName","onConfirm"],"mappings":"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"}

package/dist/components/integration-gallery.d.ts

@@ -1,6 +1,6 @@
-import type { IntegrationCapabilityDto } from '@shipfox/api-integration-core-dto';
+import type { IntegrationCapability } from '#core/models.js';
 export interface IntegrationGalleryProps {
-    capability?: IntegrationCapabilityDto;
+    capability?: IntegrationCapability;
     emptyProvidersMessage?: string;
     workspaceId?: string;
 }

package/dist/components/integration-gallery.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"integration-gallery.d.ts","sourceRoot":"","sources":["../../src/components/integration-gallery.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,wBAAwB,EAAC,MAAM,mCAAmC,CAAC;AAIhF,MAAM,WAAW,uBAAuB;IACtC,UAAU,CAAC,EAAE,wBAAwB,CAAC;IACtC,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wBAAgB,kBAAkB,CAAC,EACjC,UAAU,EACV,qBAAmF,EACnF,WAAW,GACZ,EAAE,uBAAuB,+BAiBzB"}
+{"version":3,"file":"integration-gallery.d.ts","sourceRoot":"","sources":["../../src/components/integration-gallery.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AAG3D,MAAM,WAAW,uBAAuB;IACtC,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wBAAgB,kBAAkB,CAAC,EACjC,UAAU,EACV,qBAAmF,EACnF,WAAW,GACZ,EAAE,uBAAuB,+BAiBzB"}