@manta-eu/react 0.5.1 → 0.7.0

package/src/routes/integrations/components/connect-forms/OAuthSetupConnectForm.tsx

@@ -85,11 +85,12 @@ export function OAuthSetupConnectForm<Row extends SetupRow>(props: OAuthSetupCon
   const [selectedIds, setSelectedIds] = useState<ReadonlySet<string>>(new Set());
   const hasDismissedRef = useRef(false);
   const [connectionExpired, setConnectionExpired] = useState(false);
+  const [submitted, setSubmitted] = useState(false);
 
   const states = setup.progress?.state;
   const phase = connectionExpired
     ? "failed"
-    : derivePhase({ states, hasStartedOAuth, hasSeenActiveState, resumesUnfinishedSetup });
+    : derivePhase({ states, hasStartedOAuth, hasSeenActiveState, resumesUnfinishedSetup, submitted });
 
   useWindowFocusPoll(setup.refetchProgress, { enabled: activePhases.includes(phase), intervalMs: pollIntervalMs });
 
@@ -114,6 +115,7 @@ export function OAuthSetupConnectForm<Row extends SetupRow>(props: OAuthSetupCon
 
   function handleOpened() {
     setConnectionExpired(false);
+    setSubmitted(false);
     setSelectedIds(new Set());
     setup.resetProgress();
     setHasSeenActiveState(false);
@@ -131,21 +133,25 @@ export function OAuthSetupConnectForm<Row extends SetupRow>(props: OAuthSetupCon
 
   async function handleSubmit() {
     if (selectedIds.size === 0) return;
+    setSubmitted(true);
     try {
       const result = await setup.connect([...selectedIds]);
       if (result.state.includes(GQLGoogleSetupStateEnum.NotFound)) {
+        setSubmitted(false);
         setConnectionExpired(true);
         setSelectedIds(new Set());
         return;
       }
       await setup.refetchProgress();
     } catch (err) {
+      setSubmitted(false);
       const info = parseError(err, `Failed to connect ${providerName}`);
       toast.error(info.message, { description: info.description });
     }
   }
 
   function handleRetry() {
+    setSubmitted(false);
     setSelectedIds(new Set());
     hasDismissedRef.current = false;
     setup.resetProgress();
@@ -343,7 +349,7 @@ function SubmittingView(props: CopyProps) {
     <div className="grid gap-4">
       <div className="grid gap-1">
         <h2 className="typography-large-body-semibold text-default-foreground">Connecting your {copy.entityPlural}</h2>
-        <p className="typography-caption text-muted-foreground">Hold tight — this usually takes a few seconds.</p>
+        <p className="typography-caption text-muted-foreground">This can take a minute. Keep this window open.</p>
       </div>
       <StatusLine label="Provisioning…" />
     </div>

package/src/routes/integrations/components/connect-forms/meta-page-tree.ts

@@ -0,0 +1,17 @@
+import { GQLMetaPageKind, type GQLMetaPage } from "@manta-eu/client";
+import { buildTreeRows, type TreeSelectItem } from "#components/tree-multi-select/index";
+
+// Each Instagram account sits under the Page it is linked to, and is picked on its own.
+export function metaPageTreeItems(pages: readonly GQLMetaPage[]): TreeSelectItem[] {
+  return buildTreeRows(pages).map(({ node, depth }) => ({
+    id: node.id,
+    label: node.name ?? (node.kind === GQLMetaPageKind.Instagram ? `Instagram account ${node.id}` : node.id),
+    caption: node.kind === GQLMetaPageKind.Instagram ? "Instagram" : undefined,
+    selectable: true,
+    depth,
+  }));
+}
+
+export function picksAPage(pages: readonly GQLMetaPage[], selectedIds: ReadonlySet<string>): boolean {
+  return pages.some((page) => page.kind === GQLMetaPageKind.Page && selectedIds.has(page.id));
+}

package/src/routes/integrations/components/connect-forms/oauth-setup-phase.ts

@@ -9,6 +9,8 @@ export type DerivePhaseInput = {
   hasSeenActiveState: boolean;
   // Off when the account is connected before its picker, so a leftover setup cannot stand in for a new sign-in.
   resumesUnfinishedSetup?: boolean;
+  // Connect was sent: progress reads the old state until the connect has run, so only an outcome ends it.
+  submitted?: boolean;
 };
 
 const statePriority: readonly GQLGoogleSetupStateEnum[] = [
@@ -34,10 +36,14 @@ export function derivePhase({
   hasStartedOAuth,
   hasSeenActiveState,
   resumesUnfinishedSetup = true,
+  submitted = false,
 }: DerivePhaseInput): Phase {
   const defaultPhase: Phase = hasStartedOAuth ? "awaitingOAuth" : "idle";
   if (!hasStartedOAuth && !resumesUnfinishedSetup) return defaultPhase;
   const dominant = statePriority.find((state) => states?.includes(state));
+  const settled =
+    states?.includes(GQLGoogleSetupStateEnum.NotFound) || (dominant !== undefined && terminalStates.includes(dominant));
+  if (submitted && !settled) return "submitting";
   if (dominant && terminalStates.includes(dominant) && !hasSeenActiveState) return defaultPhase;
   return match(dominant)
     .returnType<Phase>()

package/src/routes/integrations/connection-view.ts

@@ -87,6 +87,7 @@ const grantExpiryWarningDays = 14;
 // Integrations whose account is limited to what was picked at connect time, so an empty pick reads nothing.
 const oauthIncludedResourcesLabels: Partial<Record<GQLIntegration, { label: string; noneLabel: string }>> = {
   [GQLIntegration.Dash]: { label: "Folders", noneLabel: "No folders selected" },
+  [GQLIntegration.Meta]: { label: "Pages", noneLabel: "No Pages picked, reconnect to pick them" },
 };
 
 function timeAgoLabel(event: string, at: string | null | undefined): string | undefined {

package/src/routes/plans/components/ActionPlansPage.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import { GQLActionPlanState } from "@manta-eu/client";
 import { buildPlanHref as defaultBuildPlanHref } from "@manta-eu/client/shared/agent-mode";
 import { isPresent } from "@manta-eu/lib/present";
 import type { SortingState } from "@tanstack/react-table";
@@ -32,6 +31,7 @@ import {
 } from "./actionPlansTableConfig";
 import { renderDefaultActionPlansFrame, type ActionPlansFrameProps } from "./frame";
 import { ExecutePlanDialog } from "#components/planning/ExecutePlanDialog";
+import { canNeedApproval } from "#components/planning/plan-detail-utils";
 import { createTableConfig, useTableState } from "#components/table/index";
 import { useActionPlans } from "#hooks/useActionPlans";
 import { useFittedPagination } from "#hooks/useFittedPagination";
@@ -168,13 +168,13 @@ export function ActionPlansPage(props: ActionPlansPageProps) {
     }
   }, [count, isLoading, pageIndex, totalPages]);
 
-  const runningPlanIris = useMemo(
-    () => plans.filter((plan) => plan.state === GQLActionPlanState.Running).map((plan) => plan.iri),
+  const approvablePlanIris = useMemo(
+    () => plans.filter((plan) => canNeedApproval(plan.state)).map((plan) => plan.iri),
     [plans],
   );
 
   const { data: manualActionsByPlan } = useManualActionsForPlans({
-    planGraphIris: runningPlanIris,
+    planGraphIris: approvablePlanIris,
     refetchIntervalMs: 10000,
   });
 

package/src/routes/plans/components/PlanDetailRouteContent.tsx

@@ -21,6 +21,7 @@ import type { PlanViewMode } from "#components/planning/TopBar";
 import { useActionPlanDetail } from "#hooks/useActionPlanDetail";
 import { useActionPlanExecution } from "#hooks/useActionPlanExecution";
 import { ActionPlanChangesTable, useActionPlanExecutionProvenance, useManualActions } from "#ldo-ui";
+import { getPendingManualActions } from "#lib/manual-actions";
 import { useMantaClient } from "#providers/MantaClientProvider";
 import { ActivityDetail } from "#routes/activity/detail/ActivityDetail";
 import { invalidateActionPlanQueries } from "#shared/query-keys";
@@ -138,6 +139,7 @@ export function PlanDetailRouteContent(props: PlanDetailRouteContentProps) {
     triggeredAtMs: executionControl.triggeredAtMs,
     isRunningOverride: hasConfirmedExecution || hasExecutionEvidence,
   });
+  const pendingApprovalCount = getPendingManualActions(manualActions).length;
   const { triggeredAtMs, dryRun } = executionControl;
   const isDryRun = deriveIsDryRun({ provenance: executionProvenance ?? null, triggeredAtMs, dryRun });
   const shouldShowActioningSurface =
@@ -180,6 +182,7 @@ export function PlanDetailRouteContent(props: PlanDetailRouteContentProps) {
         viewMode={activeViewMode}
         stateOverride={derivedPlanState}
         isDryRun={isDryRun}
+        pendingApprovalCount={pendingApprovalCount}
         onViewModeChange={setViewMode}
         onExecute={detailExecuteAction}
         onCancel={detailCancelAction}