@equinor/fusion-framework-dev-portal 11.0.3 → 11.0.5

package/src/PersonSideSheet/sheets/roles/RolesSheetContent.test.tsx

@@ -1,86 +0,0 @@
-import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
-
-import { RolesSheetContent } from './RolesSheetContent';
-
-const mocks = vi.hoisted(() => ({
-  createClient: vi.fn(),
-  currentUser: { localAccountId: 'account-id' },
-  framework: {
-    modules: { serviceDiscovery: { createClient: vi.fn() } },
-  },
-}));
-
-mocks.framework.modules.serviceDiscovery.createClient = mocks.createClient;
-
-vi.mock('@equinor/fusion-framework-react', () => ({
-  useFramework: () => mocks.framework,
-}));
-
-vi.mock('@equinor/fusion-framework-react/hooks', () => ({
-  useCurrentUser: () => mocks.currentUser,
-}));
-
-vi.mock('./ClaimableRole', () => ({
-  ClaimableRole: () => <div>Claimable role</div>,
-}));
-
-describe('RolesSheetContent', () => {
-  beforeEach(() => {
-    mocks.createClient.mockReset();
-    mocks.currentUser.localAccountId = 'account-id';
-  });
-
-  afterEach(() => {
-    cleanup();
-  });
-
-  it('renders loading and empty states', async () => {
-    const json = vi.fn().mockResolvedValue([]);
-    mocks.createClient.mockResolvedValue({ json });
-
-    render(<RolesSheetContent navigate={vi.fn()} />);
-
-    expect(screen.getByLabelText('Loading roles')).toBeTruthy();
-    expect(await screen.findByText('You have no available roles')).toBeTruthy();
-    expect(json).toHaveBeenCalledTimes(2);
-  });
-
-  it('retries role retrieval after a failure', async () => {
-    const json = vi
-      .fn()
-      .mockRejectedValueOnce(new Error('Roles service unavailable'))
-      .mockResolvedValue([]);
-    mocks.createClient.mockResolvedValue({ json });
-
-    render(<RolesSheetContent navigate={vi.fn()} />);
-
-    expect(await screen.findByText('Roles service unavailable')).toBeTruthy();
-    fireEvent.click(screen.getByRole('button', { name: 'Retry' }));
-
-    expect(screen.getByLabelText('Loading roles')).toBeTruthy();
-    await waitFor(() => expect(mocks.createClient).toHaveBeenCalledTimes(2));
-    expect(await screen.findByText('You have no available roles')).toBeTruthy();
-  });
-
-  it('hides stale assignments while loading roles for a changed account', async () => {
-    const initialJson = vi
-      .fn()
-      .mockResolvedValueOnce([{ id: 'old-assignment' }])
-      .mockResolvedValueOnce([]);
-    const pendingJson = vi.fn().mockReturnValue(new Promise(() => undefined));
-    mocks.createClient
-      .mockResolvedValueOnce({ json: initialJson })
-      .mockResolvedValueOnce({ json: pendingJson });
-
-    const { rerender } = render(<RolesSheetContent navigate={vi.fn()} />);
-
-    expect(await screen.findByText('Claimable role')).toBeTruthy();
-
-    mocks.currentUser.localAccountId = 'next-account-id';
-    rerender(<RolesSheetContent navigate={vi.fn()} />);
-
-    expect(screen.getByLabelText('Loading roles')).toBeTruthy();
-    expect(screen.queryByText('Claimable role')).toBeNull();
-  });
-});

package/src/PersonSideSheet/sheets/roles/RolesSheetContent.tsx

@@ -1,207 +0,0 @@
-import {
-  Banner,
-  Button,
-  CircularProgress,
-  Divider,
-  Icon,
-  Tabs,
-  Typography,
-} from '@equinor/eds-core-react';
-import { arrow_back, verified_user } from '@equinor/eds-icons';
-import { useFramework } from '@equinor/fusion-framework-react';
-import { useCurrentUser } from '@equinor/fusion-framework-react/hooks';
-import { type ReactElement, useEffect, useRef, useState } from 'react';
-import styled from 'styled-components';
-
-import type { SheetContentProps } from '../types';
-import { ClaimableRole } from './ClaimableRole';
-import { RolesApi, type ClaimableRoleAssignment, type PermanentRoleAssignment } from './RolesApi';
-
-Icon.add({ arrow_back, verified_user });
-
-const Styled = {
-  Content: styled.div`
-    display: flex;
-    flex-direction: column;
-    gap: 1rem;
-    padding: 1rem 0.5rem;
-  `,
-  Role: styled.div`
-    display: flex;
-    gap: 1rem;
-    align-items: center;
-    padding: 0.5rem;
-  `,
-  Indicator: styled.div<{ $active: boolean }>`
-    width: 0.25rem;
-    height: 2.5rem;
-    background: ${({ $active }) => ($active ? '#007079' : '#dcdcdc')};
-  `,
-};
-
-/**
- * Displays the signed-in user's consolidated claimable and permanent Fusion roles.
- *
- * The role collections use the same Roles V2 endpoints as the production portal.
- *
- * @param props.navigate - Navigates back to the person side sheet landing page.
- * @returns A tabbed role overview with loading, error, and empty states.
- */
-export const RolesSheetContent = ({ navigate }: SheetContentProps): ReactElement => {
-  const framework = useFramework();
-  const user = useCurrentUser();
-  const [tab, setTab] = useState(0);
-  const [claimableRoles, setClaimableRoles] = useState<ClaimableRoleAssignment[]>([]);
-  const [permanentRoles, setPermanentRoles] = useState<PermanentRoleAssignment[]>([]);
-  const [isLoading, setIsLoading] = useState(true);
-  const [error, setError] = useState<string>();
-  const [loadAttempt, setLoadAttempt] = useState(0);
-  const latestLoadAttempt = useRef(loadAttempt);
-  latestLoadAttempt.current = loadAttempt;
-
-  /** Starts a fresh role request after a retrieval failure. */
-  const handleRetry = (): void => {
-    setError(undefined);
-    setIsLoading(true);
-    setLoadAttempt((attempt) => attempt + 1);
-  };
-
-  /**
-   * Replaces a changed assignment after activation or deactivation succeeds.
-   * @param changedAssignment - Updated claimable assignment returned by the role row.
-   */
-  const handleClaimableRoleChange = (changedAssignment: ClaimableRoleAssignment): void => {
-    setClaimableRoles((currentRoles) => {
-      // Preserve the endpoint ordering while updating only the role that changed.
-      return currentRoles.map((assignment) =>
-        assignment.id === changedAssignment.id ? changedAssignment : assignment,
-      );
-    });
-  };
-
-  useEffect(() => {
-    let isActive = true;
-    const currentLoadAttempt = loadAttempt;
-
-    // Hide assignments from the previous account before resolving the next role snapshot.
-    setIsLoading(true);
-    setError(undefined);
-
-    /** Loads both role collections together so the tabs represent one consistent snapshot. */
-    const loadRoles = async (): Promise<void> => {
-      // A Roles V2 account identifier is required before either endpoint can be queried.
-      if (!user?.localAccountId) {
-        setError('Unable to resolve the signed-in Fusion account.');
-        setIsLoading(false);
-        return;
-      }
-
-      try {
-        const client = await framework.modules.serviceDiscovery.createClient('rolesv2');
-        const rolesApi = new RolesApi(client, user.localAccountId);
-        const [claimable, permanent] = await Promise.all([
-          rolesApi.getClaimableRoles(),
-          rolesApi.getPermanentRoles(),
-        ]);
-
-        // Ignore a completed request after the side sheet content has unmounted.
-        if (isActive && latestLoadAttempt.current === currentLoadAttempt) {
-          setClaimableRoles(claimable);
-          setPermanentRoles(permanent);
-          setError(undefined);
-        }
-      } catch (cause) {
-        // Keep transport details out of the side sheet while preserving a useful retry direction.
-        if (isActive && latestLoadAttempt.current === currentLoadAttempt) {
-          setError(cause instanceof Error ? cause.message : 'Failed to load roles.');
-        }
-      } finally {
-        // Avoid updating state when navigation unmounts this sheet during a request.
-        if (isActive && latestLoadAttempt.current === currentLoadAttempt) {
-          setIsLoading(false);
-        }
-      }
-    };
-
-    void loadRoles();
-
-    return () => {
-      isActive = false;
-    };
-  }, [framework, user?.localAccountId, loadAttempt]);
-
-  // Prepare role rows before markup so the tab panels only render presentation state.
-  const claimableItems = claimableRoles.map((assignment) => (
-    <ClaimableRole
-      key={assignment.id}
-      assignment={assignment}
-      onChange={handleClaimableRoleChange}
-    />
-  ));
-
-  // Permanent assignments include scope context but do not expose activation controls.
-  const permanentItems = permanentRoles.map((assignment) => {
-    const scope =
-      !assignment.scope || assignment.scope.isGlobal ? 'Global' : assignment.scope.value;
-    return (
-      <Styled.Role key={assignment.id}>
-        <Styled.Indicator $active={true} />
-        <div>
-          <Typography>{assignment.role.displayName}</Typography>
-          <Typography variant="overline">
-            {assignment.role.name}
-            {scope ? ` (${scope})` : ''}
-          </Typography>
-        </div>
-      </Styled.Role>
-    );
-  });
-
-  return (
-    <section>
-      <Button variant="ghost" onClick={() => navigate()}>
-        <Icon name="arrow_back" />
-        <Icon name="verified_user" />
-        My Roles
-      </Button>
-      <Divider />
-      <Styled.Content>
-        {isLoading ? (
-          <CircularProgress aria-label="Loading roles" />
-        ) : error ? (
-          <>
-            <Banner>
-              <Banner.Message>{error}</Banner.Message>
-            </Banner>
-            <Button variant="outlined" onClick={handleRetry}>
-              Retry
-            </Button>
-          </>
-        ) : (
-          <Tabs activeTab={tab} onChange={(index) => setTab(Number(index))}>
-            <Tabs.List>
-              <Tabs.Tab>Claimable</Tabs.Tab>
-              <Tabs.Tab>Permanent</Tabs.Tab>
-            </Tabs.List>
-            <Tabs.Panels>
-              <Tabs.Panel>
-                {claimableItems.length > 0 ? (
-                  claimableItems
-                ) : (
-                  <Typography>You have no available roles</Typography>
-                )}
-              </Tabs.Panel>
-              <Tabs.Panel>
-                {permanentItems.length > 0 ? (
-                  permanentItems
-                ) : (
-                  <Typography>You have no permanent roles assigned</Typography>
-                )}
-              </Tabs.Panel>
-            </Tabs.Panels>
-          </Tabs>
-        )}
-      </Styled.Content>
-    </section>
-  );
-};

package/src/PersonSideSheet/sheets/roles/index.ts

@@ -1 +0,0 @@
-export { RolesSheetContent } from './RolesSheetContent';

package/src/PersonSideSheet/sheets/styled.tsx

@@ -1,33 +0,0 @@
-import styled from 'styled-components';
-
-/**
- * Shared styled components used by feature toggle lists in the person side sheet.
- */
-export const Styled = {
-  SwitchList: styled.ul`
-        list-style: none;
-        padding-left: 0;
-    `,
-  SwitchListItem: styled.li`
-        display: flex;
-        flex-flow: row nowrap;
-        justify-content: space-between;
-        margin: 1em 0;
-        border-left: 3px solid var(--eds_interactive_primary__resting, rgba(0, 112, 121, 1));
-        cursor: pointer;
-    `,
-  SwitchLabel: styled.div`
-        display: flex;
-        flex-direction: column;
-        align-items: flex-start;
-        justify-content: center;
-        width: 85%;
-        transform: scale(0.9);
-    `,
-  Switch: styled.div`
-        width: 15%;
-        display: flex;
-        justify-content: flex-end;
-        transform: scale(0.9);
-    `,
-};

package/src/PersonSideSheet/sheets/types.ts

@@ -1,14 +0,0 @@
-/**
- * Shared props for person side sheet sub-pages.
- *
- * Each sheet content component receives these props from the parent
- * {@link PersonSideSheet} to support navigation between sheets.
- */
-export type SheetContentProps = {
-  /** Azure AD object ID of the current user. */
-  readonly azureId?: string;
-  /** Key of the currently active sheet. */
-  readonly sheet?: string;
-  /** Navigates to a different sheet by key, or back to the landing sheet when called without arguments. */
-  navigate(sheet?: string): void;
-};

package/src/Router.tsx

@@ -1,83 +0,0 @@
-import { useBookmarkNavigate } from '@equinor/fusion-framework-react-module-bookmark/portal';
-
-import { Router as FusionRouter, Outlet, useParams } from '@equinor/fusion-framework-react-router';
-import AppLoader from './AppLoader';
-import { Header } from './Header';
-
-import { styled } from 'styled-components';
-
-const Styled = {
-  ContentContainer: styled.div`
-        display: grid;
-        grid-template-columns: 1fr;
-        grid-template-rows: 48px 1fr;
-        height: 100vh;
-        overflow: hidden;
-        grid-template-areas: 'head' 'main';
-    `,
-  Head: styled.section`
-        grid-area: head;
-        z-index: 2;
-    `,
-  Main: styled.section`
-        grid-area: main;
-        --header-height: 48px;
-        overflow: auto;
-        position: relative;
-        z-index: 1;
-        max-width: 100%;
-        display: grid;
-    `,
-};
-
-/**
- * Root layout component for the dev portal.
- *
- * Renders the header and a scrollable main area via `Outlet`. Activates
- * bookmark-to-navigation linking through `useBookmarkNavigate`.
- */
-const Root = () => {
-  useBookmarkNavigate({ resolveAppPath: (appKey: string) => `/apps/${appKey}` });
-  return (
-    <Styled.ContentContainer>
-      <Styled.Head>
-        <Header />
-      </Styled.Head>
-      <Styled.Main>
-        <Outlet />
-      </Styled.Main>
-    </Styled.ContentContainer>
-  );
-};
-
-/**
- * Route component that extracts the `appKey` parameter and delegates to {@link AppLoader}.
- */
-const AppRoute = () => {
-  const { appKey } = useParams();
-  return appKey ? <AppLoader appKey={appKey} /> : null;
-};
-
-/** Route definitions for the dev portal. */
-const routes = [
-  {
-    path: '/',
-    element: <Root />,
-    children: [
-      {
-        path: 'apps/:appKey/*',
-        element: <AppRoute />,
-      },
-    ],
-  },
-];
-
-/**
- * Top-level router for the Fusion Dev Portal.
- *
- * Uses `@equinor/fusion-framework-react-router` which automatically connects
- * to the framework's navigation module for history and basename.
- */
-export const Router = () => {
-  return <FusionRouter routes={routes} />;
-};

package/src/configure.ts

@@ -1,186 +0,0 @@
-import { enableAppModule, type AppModule } from '@equinor/fusion-framework-module-app';
-import { enableBookmark } from '@equinor/fusion-framework-react-module-bookmark';
-import type { FrameworkConfigurator } from '@equinor/fusion-framework';
-import { enableAnalytics } from '@equinor/fusion-framework-module-analytics';
-import { ConsoleAnalyticsAdapter } from '@equinor/fusion-framework-module-analytics/adapters';
-import { enableContext } from '@equinor/fusion-framework-module-context';
-import {
-  enableNavigation,
-  type NavigationModule,
-} from '@equinor/fusion-framework-module-navigation';
-import { enableServices } from '@equinor/fusion-framework-module-services';
-import { enableFeatureFlagging } from '@equinor/fusion-framework-module-feature-flag';
-import {
-  createLocalStoragePlugin,
-  createUrlPlugin,
-} from '@equinor/fusion-framework-module-feature-flag/plugins';
-import { enableAgGrid } from '@equinor/fusion-framework-module-ag-grid';
-import { enableTelemetry } from '@equinor/fusion-framework-module-telemetry';
-import {
-  enableContextNavigation,
-  legacyAppNavigationFix,
-} from '@equinor/fusion-framework-plugin-context-navigation';
-import {
-  buildContextUrlForStrategy,
-  resolveContextIdFromUrl,
-} from '@equinor/fusion-framework-plugin-context-navigation/utils';
-import { version } from './version';
-
-declare global {
-  interface Window {
-    /**
-     * AG Grid license key for enabling enterprise features.
-     * @remarks Typically set via environment variables during build time.
-     */
-    FUSION_AG_GRID_KEY?: string;
-  }
-}
-
-/**
- * Configures the Fusion Dev Portal framework with all required modules.
- *
- * Modules enabled:
- * - **Telemetry** — portal-scoped usage analytics with version metadata.
- * - **App** — application manifest loading and lifecycle.
- * - **Context** — context routing URL hooks (path generator + extractor) wired to the shared context-navigation URL utilities.
- * - **Context Navigation plugin** — keeps the browser URL in sync with the
- *   active context, handles app-switch carry-over, and guards against
- *   accidental context loss. Telemetry is auto-resolved from the framework
- *   telemetry module.
- * - **Navigation** — router integration with telemetry.
- * - **Services** — standard Fusion service integrations.
- * - **AG Grid** — enterprise license key from `window.FUSION_AG_GRID_KEY`.
- * - **Analytics** — console adapter gated by the `fusionLogAnalytics` feature flag.
- * - **Bookmarks** — source-system metadata identifying CLI-created bookmarks.
- * - **Feature flags** — local-storage and URL-based flag plugins for dev toggles.
- *
- * On initialization, exposes all modules on `window.Fusion` for debugging.
- *
- * @param config - The framework configurator instance to extend with portal modules.
- */
-export const configure = async (config: FrameworkConfigurator) => {
-  // Enable telemetry tracking for portal usage analytics and monitoring
-  enableTelemetry(config, {
-    attachConfiguratorEvents: true,
-    configure: (builder, ref) => {
-      // Set metadata identifying this as portal telemetry with version info
-      builder.setMetadata(() => ({
-        fusion: {
-          type: 'portal-telemetry',
-          portal: { version, name: 'Fusion Dev Portal' },
-        },
-      }));
-      // Scope telemetry events to portal-specific tracking
-      builder.setDefaultScope(['portal']);
-      // Inherit parent telemetry configuration for consistent tracking
-      builder.setParent(ref.telemetry);
-    },
-  });
-
-  enableAppModule(config);
-
-  /**
-   * Configure context module with dev-portal URL conventions.
-   *
-   * This wires the context module's URL hooks — the path generator
-   * and path extractor — to the dev-portal's URL routing strategy.
-   *
-   * The context-navigation plugin keeps the browser URL in sync with the
-   * active context as it changes at runtime.
-   */
-  enableContext(config, (builder) => {
-    builder.setContextPathGenerator((context, path) =>
-      buildContextUrlForStrategy(context?.id, path),
-    );
-
-    builder.setContextPathExtractor((path) => resolveContextIdFromUrl(path));
-  });
-
-  enableNavigation(config, {
-    configure: (config) => {
-      config.setBasename('/');
-      config.setTelemetry(async (args) => {
-        // Only provide telemetry when the telemetry module was actually enabled
-        if (args.hasModule('telemetry')) {
-          return await args.requireInstance('telemetry');
-        }
-      });
-    },
-  });
-
-  enableServices(config);
-
-  // Configure AG Grid with license key from environment if provided
-  enableAgGrid(config, (builder) => {
-    builder.setLicenseKey(window.FUSION_AG_GRID_KEY);
-  });
-
-  enableAnalytics(config, (builder) => {
-    builder.setAdapter('console', async (args) => {
-      // Only resolve the feature-flag-gated adapter when the featureFlag module is enabled
-      if (args.hasModule('featureFlag')) {
-        const featureFlagProvider = await args.requireInstance('featureFlag');
-        // Only log analytics to the console when the feature flag is explicitly enabled
-        if (featureFlagProvider.getFeature('fusionLogAnalytics')?.enabled) {
-          return new ConsoleAnalyticsAdapter();
-        }
-      }
-    });
-  });
-
-  // Configure bookmark functionality with CLI as the source system
-  enableBookmark(config, (builder) => {
-    // Identify bookmarks created in dev portal as coming from CLI system
-    builder.setSourceSystem({
-      subSystem: 'CLI',
-      identifier: 'fusion-cli',
-      name: 'Fusion CLI',
-    });
-  });
-
-  // Configure feature flags for development and demo purposes
-  enableFeatureFlagging(config, (builder) => {
-    // Add local storage plugin for persistent feature flag storage
-    builder.addPlugin(
-      createLocalStoragePlugin([
-        {
-          key: 'fusionDebug',
-          title: 'Fusion debug log',
-          description: 'Show Fusion debug log in console',
-        },
-        {
-          key: 'fusionLogAnalytics',
-          title: 'Log Fusion Analytics',
-          description: 'Show Analytics events in console',
-        },
-        {
-          key: 'pinkBg',
-          title: 'Use pink bg?',
-          description: 'When enabled the background should be pink',
-        },
-      ]),
-    );
-    // Add URL plugin to allow enabling debug features via query parameters
-    builder.addPlugin(createUrlPlugin(['fusionDebug']));
-  });
-
-  // Keep portal URLs aligned with the active app/context combination by using
-  // the shared context-navigation plugin and the dev-portal URL helpers.
-  enableContextNavigation(config, (builder) => {
-    builder.setPortalName('dev-portal');
-    builder.setDebug(true);
-    builder.setUrlGuard(true);
-    builder.setNavigationOptions({
-      replace: false, // Use pushState for navigation to allow back button support
-    });
-  });
-
-  config.onInitialized<[AppModule, NavigationModule]>((modules) => {
-    // Reset legacy app routers on context navigation for apps with navigation <v7.
-    legacyAppNavigationFix({ event: modules.event });
-
-    // Expose framework modules globally for development debugging and inspection.
-    // @ts-expect-error — `window` is not typed with `Fusion`
-    window.Fusion = { modules };
-  });
-};

package/src/get-app-tag-from-url.ts

@@ -1,17 +0,0 @@
-/**
- * URL search-parameter key used to specify an app version tag.
- *
- * When present in the URL as `?$tag=<value>`, the portal loads that
- * specific version of the application instead of the default.
- */
-const TAG = '$tag';
-
-/**
- * Reads the application version tag from the current URL search parameters.
- *
- * @returns The tag string if the `$tag` search parameter is present, otherwise `null`.
- */
-export const getAppTagFromUrl = (): string | null => {
-  const url = new URL(window.location.href);
-  return url.searchParams.get(TAG);
-};

package/src/globals.d.ts

@@ -1,32 +0,0 @@
-/**
- * Ambient JSX type declarations for Lit/WCEV web components used by dev-portal.
- *
- * `@types/react@19` removed the global `JSX` namespace — augmentations must
- * target the `react` module's `JSX` namespace instead.
- *
- * The `@equinor/fusion-wc-person` package still uses the old `global JSX` pattern
- * with computed-property keys so its declarations are not picked up by the compiler.
- * This file re-declares the elements with string-literal keys in the correct location.
- */
-export {};
-
-declare module 'react' {
-  namespace JSX {
-    interface IntrinsicElements {
-      'fwc-person-avatar': React.DetailedHTMLProps<
-        React.HTMLAttributes<HTMLElement> & {
-          azureId?: string;
-          size?: string;
-          clickable?: boolean;
-        },
-        HTMLElement
-      >;
-      'fwc-person-list-item': React.DetailedHTMLProps<
-        React.HTMLAttributes<HTMLElement> & {
-          azureId?: string;
-        },
-        HTMLElement
-      >;
-    }
-  }
-}