@manta-eu/react 0.7.0 → 0.8.1

package/src/hooks/resolved-terms.ts

@@ -4,6 +4,7 @@ import { createTermBatcher, type TermBatcher } from "../lib/term-batcher";
 export type ResolvedTerms<T> = {
   values: Map<string, T>;
   request: (iris: string[]) => void;
+  refresh?: (iris: string[]) => void;
   // IRIs whose lookup has completed, found or not. Absent in static contexts
   // (tests), which are treated as already settled.
   settledIris?: ReadonlySet<string>;
@@ -137,6 +138,10 @@ export function useResolvedTermsState<T>(
   }, [batcher]);
 
   const request = useCallback((iris: string[]) => batcher.request(iris), [batcher]);
+  const refresh = useCallback((iris: string[]) => batcher.request(iris, { force: true }), [batcher]);
 
-  return useMemo(() => ({ values, request, settledIris, failedIris }), [values, request, settledIris, failedIris]);
+  return useMemo(
+    () => ({ values, request, refresh, settledIris, failedIris }),
+    [values, request, refresh, settledIris, failedIris],
+  );
 }

package/src/hooks/useAuth.ts

@@ -1,4 +1,5 @@
 import { SessionContextDocument } from "@manta-eu/client";
+import { loginStatusPollMs } from "@manta-eu/client/shared/constants";
 import { datastoreHeader } from "@manta-eu/client/shared/datastore-path";
 import { createHttpError, isHttpError } from "@manta-eu/client/shared/error-utils";
 import { isValidModelId, type MantaModelId } from "@manta-eu/client/shared/model";
@@ -22,6 +23,7 @@ export type UseAuthResult = {
   user: User | undefined;
   datastore: Datastore | undefined;
   datastores: Datastore[] | undefined;
+  inOrganization: boolean;
   isLoading: boolean;
   isAuthenticated: boolean;
   isOperator: boolean;
@@ -188,7 +190,8 @@ export function useAuth(): UseAuthResult {
     // Keycloak's SSO session idle timeout (default 30 min) only resets when a request
     // actually reaches processMiddleware. A long WS-only chat session with no other HTTP
     // traffic would otherwise let the underlying session go idle and die silently.
-    refetchInterval: 5 * 60 * 1000,
+    // The poll also renews the access token before it expires, so it must run more often than the token lives.
+    refetchInterval: loginStatusPollMs,
     refetchIntervalInBackground: true,
   });
 
@@ -296,6 +299,7 @@ export function useAuth(): UseAuthResult {
       const datastore = sessionDatastore(row);
       return isPresent(datastore) ? [datastore] : [];
     }),
+    inOrganization: isPresent(contextData?.user?.memberOrgs) || isPresent(contextData?.datastores),
     datastoreAccessGranted: contextData?.datastoreAccessGranted ?? true,
     isOperator: contextData?.user?.isOperator ?? false,
     canManageTeam: contextData?.user?.canManageTeam ?? false,

package/src/lib/chat-types.ts

@@ -1,4 +1,4 @@
-/* eslint-disable import/order -- each type is imported beside the re-export it exists for, which is
+/* oxlint-disable import-js/order -- each type is imported beside the re-export it exists for, which is
    how this file is organized; they are type-only, so the positions have no runtime meaning. */
 import type { ConversationMode } from "@manta-eu/client/shared/chat-manager";
 import type { MantaModelId } from "@manta-eu/client/shared/model";

package/src/lib/tanstack-query.ts

@@ -1,7 +1,7 @@
 import type { QueryClient, QueryKey } from "@tanstack/react-query";
 
 export type QueryWithGetKey = {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  // oxlint-disable-next-line typescript/no-explicit-any
   getKey: (variables?: any) => QueryKey;
 };
 
@@ -12,7 +12,7 @@ function isQueryWithGetKey(keyLike: KeyLike): keyLike is QueryWithGetKey {
 }
 
 function getTopQueryKey(query: QueryWithGetKey): QueryKey {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  // oxlint-disable-next-line typescript/no-explicit-any
   const keys = query.getKey({} as any);
   return keys.slice(0, 1);
 }

package/src/lib/term-batcher.ts

@@ -14,7 +14,7 @@ export type TermBatcherConfig<T> = {
 };
 
 export type TermBatcher = {
-  request: (iris: IRI[]) => void;
+  request: (iris: IRI[], options?: { force: boolean }) => void;
   cancel: () => void;
 };
 
@@ -98,13 +98,13 @@ export function createTermBatcher<T>(config: TermBatcherConfig<T>): TermBatcher
   }
 
   return {
-    request(iris) {
+    request(iris, options) {
       cancelled = false;
 
       const unresolvable: IRI[] = [];
 
       for (const iri of iris) {
-        if (requested.has(iri)) continue;
+        if (requested.has(iri) && !options?.force) continue;
 
         requested.add(iri);
 

package/src/lib/utils.ts

@@ -1,4 +1,4 @@
-/* eslint-disable @manta-eu/no-direct-clsx */
+/* oxlint-disable @manta-eu/no-direct-clsx */
 import { clsx, type ClassValue } from "clsx";
 import { extendTailwindMerge } from "tailwind-merge";
 

package/src/providers/AuthContext.ts

@@ -21,6 +21,7 @@ export type AuthContextValue = Pick<
   // Only Manta's own web app may list the apps connected to someone; any other host's token is refused.
   canDisconnectCustomApps?: boolean;
   hasProfilePage?: boolean;
+  inOrganization?: boolean;
 };
 
 export const AuthContext = createContext<AuthContextValue | undefined>(undefined);

package/src/routes/data-explorer/components/DetailHeader.tsx

@@ -42,14 +42,14 @@ export function DetailHeader(props: DetailHeaderProps) {
     <div>
       {badges && <div className="mb-3 flex items-center gap-2">{badges}</div>}
 
-      <div className="flex items-start justify-between gap-4">
-        <div className="flex items-center gap-3">
-          <h2 className="typography-header wrap-break-words text-default-foreground">{title}</h2>
+      <div className="flex flex-col items-start justify-between gap-4 sm:flex-row">
+        <div className="flex min-w-0 items-center gap-3">
+          <h2 className="typography-header wrap-anywhere text-default-foreground">{title}</h2>
 
           {titleBadges}
         </div>
 
-        {actions && <div className="flex shrink-0 items-center gap-2">{actions}</div>}
+        {actions && <div className="flex flex-wrap items-center gap-2 sm:shrink-0">{actions}</div>}
       </div>
 
       {iri &&

package/src/routes/data-explorer/components/record-detail/RecordActions.tsx

@@ -1,5 +1,9 @@
+import { Button } from "#components/button/index";
+import { DeleteConfirmationDialog } from "#components/layouts/DeleteConfirmationDialog";
+import { useExecuteAction, type ExecuteActionResult } from "#hooks/useExecuteAction";
+import { useTriples, type TripleRow } from "#routes/data-explorer/triples";
 import { GQLExecuteActionErrorCode } from "@manta-eu/client";
-import { compactUri } from "@manta-eu/client/shared/rdf-namespaces";
+import { compactUri, wellKnownPredicates } from "@manta-eu/client/shared/rdf-namespaces";
 import { useState } from "react";
 import { toast } from "sonner";
 import type { PropertyMap } from "./action-properties";
@@ -7,10 +11,7 @@ import { useRecordActionShapes, type RecordActionShape } from "./action-shapes";
 import { ActionFormDialog } from "./ActionFormDialog";
 import { CreateAction } from "./CreateAction";
 import { RecordActionFeedback } from "./RecordActionFeedback";
-import { Button } from "#components/button/index";
-import { DeleteConfirmationDialog } from "#components/layouts/DeleteConfirmationDialog";
-import { useExecuteAction, type ExecuteActionResult } from "#hooks/useExecuteAction";
-import { useTriples, type TripleRow } from "#routes/data-explorer/triples";
+import { RecordRefresh } from "./RecordRefresh";
 
 type RecordActionsProps = { iri: string; typeIris: string[] };
 
@@ -20,20 +21,25 @@ export function RecordActions(props: RecordActionsProps) {
   const { shapes, error } = useRecordActionShapes(typeIris);
   const { triples, isLoading: triplesLoading } = useTriples(iri);
 
-  if (error) return <span className="typography-tiny text-muted-foreground">Actions unavailable</span>;
+  const recordTypes = triples
+    .filter((row) => row.predicate === wellKnownPredicates.type && row.objectIsIri)
+    .map((row) => row.object);
 
   return (
     <>
-      {shapes.map((shape) => (
-        <ShapeActions
-          key={`${iri}|${shape.actionShape}`}
-          subjectIri={iri}
-          shape={shape}
-          triples={triples}
-          triplesLoading={triplesLoading}
-          qualifyLabels={shapes.length > 1}
-        />
-      ))}
+      <RecordRefresh iri={iri} typeIris={recordTypes} />
+      {error && <span className="typography-tiny text-muted-foreground">Actions unavailable</span>}
+      {!error &&
+        shapes.map((shape) => (
+          <ShapeActions
+            key={`${iri}|${shape.actionShape}`}
+            subjectIri={iri}
+            shape={shape}
+            triples={triples}
+            triplesLoading={triplesLoading}
+            qualifyLabels={shapes.length > 1}
+          />
+        ))}
     </>
   );
 }

package/src/routes/data-explorer/components/record-detail/RecordRefresh.tsx

@@ -0,0 +1,150 @@
+import { Button } from "#components/button/index";
+import { InstanceLabelsContext } from "#hooks/use-instance-labels";
+import { useMantaClient } from "#providers/MantaClientProvider";
+import {
+  GQLRefreshResourceStatus,
+  GQLRefreshWorkflowStatus,
+  RefreshResourcesDocument,
+  RefreshResourcesStatusDocument,
+  type GQLRefreshResourceInput,
+  type GQLRefreshResourcesMutation,
+  type GQLRefreshResourcesMutationVariables,
+  type GQLRefreshResourcesStatusQuery,
+  type GQLRefreshResourcesStatusQueryVariables,
+  useRefreshResourceCapabilitiesQuery,
+} from "@manta-eu/client";
+import { isPresent } from "@manta-eu/lib/present";
+import { sleep } from "@manta-eu/lib/sleep";
+import { useIsMutating, useMutation, useQueryClient } from "@tanstack/react-query";
+import type { GraphQLClient } from "graphql-request";
+import { useContext } from "react";
+import { toast } from "sonner";
+import { match } from "ts-pattern";
+
+type RecordRefreshProps = { iri: string; typeIris: string[] };
+
+export function RecordRefresh(props: RecordRefreshProps) {
+  const { iri, typeIris } = props;
+  const { mantaClient } = useMantaClient();
+  const { data } = useRefreshResourceCapabilitiesQuery(
+    mantaClient,
+    { rdfTypes: typeIris },
+    { enabled: isPresent(typeIris) },
+  );
+  const rdfType = data?.refreshResourceCapabilities.capabilities.find((type) => type.supportsRefresh)?.rdfType;
+
+  return rdfType ? <RefreshButton key={`${iri}|${rdfType}`} iri={iri} rdfType={rdfType} /> : null;
+}
+
+type RefreshButtonProps = { iri: string; rdfType: string };
+
+type RefreshResult = GQLRefreshResourcesStatusQuery["refreshResourcesStatus"];
+
+class RefreshError extends Error {
+  constructor(
+    readonly phase: "start" | "status" | "timeout",
+    cause: unknown,
+  ) {
+    super("Unable to complete source refresh", { cause });
+  }
+}
+
+async function refreshResource(client: GraphQLClient, resource: GQLRefreshResourceInput): Promise<RefreshResult> {
+  const controller = new AbortController();
+  const timeoutMs = 5 * 60 * 1000;
+  const deadline = Date.now() + timeoutMs;
+  const timer = setTimeout(() => controller.abort(), timeoutMs);
+  let phase: "start" | "status" = "start";
+
+  try {
+    const { refreshResources } = await client.request<
+      GQLRefreshResourcesMutation,
+      GQLRefreshResourcesMutationVariables
+    >({
+      document: RefreshResourcesDocument,
+      variables: { resources: [resource] },
+      signal: controller.signal,
+    });
+    phase = "status";
+
+    while (true) {
+      controller.signal.throwIfAborted();
+      const { refreshResourcesStatus } = await client.request<
+        GQLRefreshResourcesStatusQuery,
+        GQLRefreshResourcesStatusQueryVariables
+      >({
+        document: RefreshResourcesStatusDocument,
+        variables: { workflowId: refreshResources.workflowId },
+        signal: controller.signal,
+      });
+      controller.signal.throwIfAborted();
+      if (refreshResourcesStatus.status !== GQLRefreshWorkflowStatus.Running) return refreshResourcesStatus;
+
+      await sleep(Math.min(2000, Math.max(0, deadline - Date.now())));
+    }
+  } catch (error) {
+    throw new RefreshError(controller.signal.aborted ? "timeout" : phase, error);
+  } finally {
+    clearTimeout(timer);
+  }
+}
+
+function RefreshButton(props: RefreshButtonProps) {
+  const { iri, rdfType } = props;
+  const { mantaClient, datastoreId } = useMantaClient();
+  const queryClient = useQueryClient();
+  const labels = useContext(InstanceLabelsContext);
+  const refreshLabels = labels?.refresh;
+  const pendingFilter = { mutationKey: ["RefreshResource", datastoreId, iri], exact: true };
+  const refreshing = useIsMutating(pendingFilter) > 0;
+  const { mutate } = useMutation<RefreshResult, RefreshError>({
+    mutationKey: pendingFilter.mutationKey,
+    mutationFn: () => refreshResource(mantaClient, { iri, type: rdfType }),
+    retry: false,
+    onSuccess: (result) => {
+      if (result.status === GQLRefreshWorkflowStatus.Failed) {
+        toast.error("Refresh failed", { description: result.error ?? undefined });
+        return;
+      }
+
+      const status = result.results?.find(
+        (resource) => resource.iri === iri && resource.type === rdfType,
+      )?.refreshStatus;
+      match(status)
+        .with(GQLRefreshResourceStatus.Synced, () => {
+          void queryClient.invalidateQueries({ queryKey: ["data-explorer"] });
+          refreshLabels?.([iri]);
+          toast.success("Refreshed from source");
+        })
+        .with(GQLRefreshResourceStatus.NotReadable, () => toast.error("This entity does not support refresh"))
+        .with(GQLRefreshResourceStatus.NotSynced, () =>
+          toast.error("The entity could not be refreshed from its source"),
+        )
+        .with(undefined, () => toast.error("Refresh returned no result for this entity"))
+        .exhaustive();
+    },
+    onError: (error) => {
+      match(error.phase)
+        .with("start", () => toast.error("Could not start refresh"))
+        .with("status", () =>
+          toast.error("Could not check refresh status", { description: "The refresh may still be running." }),
+        )
+        .with("timeout", () =>
+          toast.warning("Refresh is taking longer than expected", {
+            description: "It may still finish in the background.",
+          }),
+        )
+        .exhaustive();
+    },
+  });
+
+  function startRefresh() {
+    if (queryClient.isMutating(pendingFilter) === 0) mutate();
+  }
+
+  return (
+    <Button variant="secondary" size="sm" disabled={refreshing} aria-busy={refreshing} onClick={startRefresh}>
+      {refreshing ? "Refreshing…" : "Refresh from source"}
+    </Button>
+  );
+}

package/src/rules/datalog-ast/DatalogBodyFormulaComponent.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable @manta-eu/no-theme-primitive-colors */
+/* oxlint-disable @manta-eu/no-theme-primitive-colors */
 
 import type {
   AggregateBinding,

package/src/rules/datalog-ast/DatalogTermComponent.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable @manta-eu/no-theme-primitive-colors */
+/* oxlint-disable @manta-eu/no-theme-primitive-colors */
 
 import type { DatalogTerm } from "@manta-eu/datalog-parser";
 import { compactUri } from "@manta-eu/rdf-lib/namespaces";

package/src/shacl/shacl-form-types.ts

@@ -41,7 +41,7 @@ declare module "@ulb-darmstadt/shacl-form" {
 }
 
 declare module "react" {
-  // eslint-disable-next-line @typescript-eslint/no-namespace -- augmenting JSX needs a namespace.
+  // oxlint-disable-next-line typescript/no-namespace -- augmenting JSX needs a namespace.
   namespace JSX {
     interface IntrinsicElements {
       "shacl-form": import("react").DetailedHTMLProps<

package/src/style.ts

@@ -1,4 +1,4 @@
-/* eslint-disable @manta-eu/no-direct-clsx */
+/* oxlint-disable @manta-eu/no-direct-clsx */
 import clsx, { type ClassValue } from "clsx";
 import { twMerge, type ClassNameValue } from "tailwind-merge";
 

package/src/templates/slack-to-markdown.ts

@@ -19,7 +19,7 @@ export function slackToMarkdown(input: string): string {
 
   output = output.replace(/([^\n])\n(?!\n)/g, "$1  \n");
 
-  // eslint-disable-next-line no-control-regex -- NUL delimits the code placeholders this file writes.
+  // oxlint-disable-next-line no-control-regex -- NUL delimits the code placeholders this file writes.
   output = output.replace(/\x00CODE(\d+)\x00/g, (_, i) => placeholders[Number(i)]!);
 
   return output;

package/src/themes/manta-dark.css

@@ -25,6 +25,8 @@
   --color-rank-3: #431407;
 
   --color-default-foreground: #ffffff;
+  --color-inverse: #05070d;
+  --color-inverse-foreground: #ffffff;
   --color-body-foreground: rgba(255, 255, 255, 0.8);
   --color-muted-foreground: #8a90a0;
   --color-placeholder-foreground: #4b4e58;

package/src/themes/manta.css

@@ -26,6 +26,8 @@
   --color-card-alpha-0: rgb(255 255 255 / 0);
 
   --color-default-foreground: #0b1b45;
+  --color-inverse: #0b1530;
+  --color-inverse-foreground: #ffffff;
   --color-body-foreground: rgba(23, 23, 23, 0.85);
   --color-muted-foreground: #5a6480;
   --color-placeholder-foreground: var(--color-muted-foreground);

package/src/themes/standard.css

@@ -48,6 +48,8 @@
   --color-rank-3: #ffe4d6;
 
   --color-default-foreground: var(--color-neutral-900);
+  --color-inverse: var(--color-neutral-900);
+  --color-inverse-foreground: #ffffff;
   --color-muted-foreground: var(--color-neutral-500);
   --color-disabled-foreground: var(--color-neutral-400);
   --color-placeholder-foreground: var(--color-neutral-400);