@openmrs/esm-metadataexport-app 4.4.1-pre.705 → 4.4.1-pre.726

package/src/components/packages-table/packages-table.test.tsx

@@ -1,10 +1,12 @@
 import React from 'react';
-import { render, screen } from '@testing-library/react';
+import { render, screen, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { type Session, useSession, userHasAccess } from '@openmrs/esm-framework';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { type ExportPackage } from '../../types/index';
 import { useAllPackages } from '../../packages/packages.resource';
 import { launchAddNewPackageWorkspace } from '../new-package/new-package-utils';
+import { launchViewPackageWorkspace } from '../view-package/view-package-utils';
 import PackagesTable from './packages-table.component';
 
 vi.mock('../../packages/packages.resource', async (importOriginal) => ({
@@ -16,13 +18,49 @@ vi.mock('../new-package/new-package-utils', () => ({
   launchAddNewPackageWorkspace: vi.fn(),
 }));
 
+vi.mock('../view-package/view-package-utils', () => ({
+  launchViewPackageWorkspace: vi.fn(),
+}));
+
 const mockUseAllPackages = vi.mocked(useAllPackages);
 const mockUseSession = vi.mocked(useSession);
 const mockUserHasAccess = vi.mocked(userHasAccess);
 const mockLaunchAddNewPackageWorkspace = vi.mocked(launchAddNewPackageWorkspace);
+const mockLaunchViewPackageWorkspace = vi.mocked(launchViewPackageWorkspace);
 
 const sessionWithUser = () => ({ user: { uuid: 'cc8507b8-7c9a-486b-85dc-b8f25ad1e4cc' } }) as unknown as Session;
 
+const builtPackage: ExportPackage = {
+  uuid: 'a1b2c3d4-0000-0000-0000-000000000001',
+  name: 'Core reference data',
+  description: 'Shared reference metadata',
+  retired: false,
+  dateCreated: 0,
+  entries: [{ domain: 'PATIENT_IDENTIFIER_TYPE', itemUuids: [] }],
+  latestBuild: {
+    uuid: 'build-0000-0000-0000-000000000001',
+    packageUuid: 'a1b2c3d4-0000-0000-0000-000000000001',
+    version: 1,
+    status: 'COMPLETED',
+    dateCreated: 0,
+    dateStarted: 0,
+    dateCompleted: 0,
+    errorMessage: null,
+    downloadUrl: null,
+    manifest: null,
+  },
+};
+
+const unbuiltPackage: ExportPackage = {
+  uuid: 'a1b2c3d4-0000-0000-0000-000000000002',
+  name: 'Facility data',
+  description: 'Facility metadata',
+  retired: false,
+  dateCreated: 0,
+  entries: [],
+  latestBuild: null,
+};
+
 describe('PackagesTable', () => {
   beforeEach(() => {
     mockUseAllPackages.mockReturnValue({
@@ -53,4 +91,36 @@ describe('PackagesTable', () => {
     expect(screen.queryByRole('button', { name: 'Record packages' })).not.toBeInTheDocument();
     expect(mockLaunchAddNewPackageWorkspace).not.toHaveBeenCalled();
   });
+
+  it('renders the build status per package and launches the view workspace with the package for the clicked row', async () => {
+    const user = userEvent.setup();
+    mockUseAllPackages.mockReturnValue({
+      packages: [builtPackage, unbuiltPackage],
+      isLoading: false,
+      isValidating: false,
+      error: undefined,
+      mutate: vi.fn(),
+    });
+    render(<PackagesTable />);
+
+    const builtRow = screen.getByRole('row', { name: /Core reference data/ });
+    const unbuiltRow = screen.getByRole('row', { name: /Facility data/ });
+
+    // Status cell reflects the latest build's status, or falls back to "No builds".
+    expect(within(builtRow).getByText('COMPLETED')).toBeInTheDocument();
+    expect(within(unbuiltRow).getByText('No builds')).toBeInTheDocument();
+
+    // Empty entries render as "All domains"; otherwise the formatted domain labels.
+    expect(within(builtRow).getByText('Patient identifier type')).toBeInTheDocument();
+    expect(within(unbuiltRow).getByText('All domains')).toBeInTheDocument();
+
+    // Clicking View resolves the row back to its package via the packagesByUuid lookup.
+    await user.click(within(builtRow).getByRole('button', { name: 'View' }));
+    expect(mockLaunchViewPackageWorkspace).toHaveBeenLastCalledWith(builtPackage);
+
+    await user.click(within(unbuiltRow).getByRole('button', { name: 'View' }));
+    expect(mockLaunchViewPackageWorkspace).toHaveBeenLastCalledWith(unbuiltPackage);
+
+    expect(mockLaunchViewPackageWorkspace).toHaveBeenCalledTimes(2);
+  });
 });

package/src/components/view-package/view-package-action-button/view-package-action-button.component.test.tsx

@@ -0,0 +1,72 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { describe, it, expect, vi, beforeEach, type Mock } from 'vitest';
+import { type Session, useSession, userHasAccess } from '@openmrs/esm-framework';
+import ViewPackageActionButton from './view-package-action-button.component';
+import { launchViewPackageWorkspace } from '../view-package-utils';
+import { type ExportPackage } from '../../../types';
+
+vi.mock('../view-package-utils', () => ({
+  launchViewPackageWorkspace: vi.fn(),
+}));
+
+const mockLaunchViewPackageWorkspace = launchViewPackageWorkspace as Mock;
+const mockUseSession = vi.mocked(useSession);
+const mockUserHasAccess = vi.mocked(userHasAccess);
+
+const sessionWithUser = () => ({ user: { uuid: 'cc8507b8-7c9a-486b-85dc-b8f25ad1e4cc' } }) as unknown as Session;
+
+const mockPackage: ExportPackage = {
+  uuid: 'a1b2c3d4-0000-0000-0000-000000000000',
+  name: 'Core data',
+  description: 'testing one',
+  retired: false,
+  dateCreated: 0,
+  entries: [],
+  latestBuild: null,
+};
+
+describe('ViewPackageActionButton', () => {
+  beforeEach(() => {
+    mockUseSession.mockReturnValue(sessionWithUser());
+    mockUserHasAccess.mockReturnValue(true);
+  });
+
+  it('renders a "View" button', () => {
+    render(<ViewPackageActionButton exportPackage={mockPackage} />);
+
+    expect(screen.getByRole('button', { name: 'View' })).toBeInTheDocument();
+  });
+
+  it('launches the view package workspace with the package when a privileged user clicks', async () => {
+    const user = userEvent.setup();
+    render(<ViewPackageActionButton exportPackage={mockPackage} />);
+
+    await user.click(screen.getByRole('button', { name: 'View' }));
+
+    expect(mockUserHasAccess).toHaveBeenCalledWith('Get Metadata Export Packages', expect.anything());
+    expect(mockLaunchViewPackageWorkspace).toHaveBeenCalledTimes(1);
+    expect(mockLaunchViewPackageWorkspace).toHaveBeenCalledWith(mockPackage);
+  });
+
+  it('disables the button for users without the Get Metadata Export Packages privilege', async () => {
+    const user = userEvent.setup();
+    mockUserHasAccess.mockReturnValue(false);
+    render(<ViewPackageActionButton exportPackage={mockPackage} />);
+
+    const button = screen.getByRole('button', { name: 'View' });
+    expect(button).toBeDisabled();
+
+    await user.click(button);
+    expect(mockLaunchViewPackageWorkspace).not.toHaveBeenCalled();
+  });
+
+  it('disables the button when there is no authenticated user', () => {
+    mockUseSession.mockReturnValue({ authenticated: false } as unknown as Session);
+    render(<ViewPackageActionButton exportPackage={mockPackage} />);
+
+    expect(screen.getByRole('button', { name: 'View' })).toBeDisabled();
+    expect(mockUserHasAccess).not.toHaveBeenCalled();
+  });
+});

package/src/components/view-package/view-package-action-button/view-package-action-button.component.tsx

@@ -0,0 +1,36 @@
+import React, { useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Button } from '@carbon/react';
+import { ArrowRight } from '@carbon/react/icons';
+import { useSession, userHasAccess } from '@openmrs/esm-framework';
+import { launchViewPackageWorkspace } from '../view-package-utils';
+import { type ExportPackage } from '../../../types';
+
+interface ViewPackageActionButtonProps {
+  exportPackage: ExportPackage;
+}
+
+const ViewPackageActionButton: React.FC<ViewPackageActionButtonProps> = ({ exportPackage }) => {
+  const { t } = useTranslation();
+  const session = useSession();
+
+  const canView = session.user ? userHasAccess('Get Metadata Export Packages', session.user) : false;
+
+  const handleView = useCallback(() => {
+    launchViewPackageWorkspace(exportPackage);
+  }, [exportPackage]);
+
+  return (
+    <Button
+      disabled={!canView}
+      onClick={handleView}
+      size="md"
+      kind="ghost"
+      renderIcon={(props) => <ArrowRight size={16} {...props} />}
+    >
+      {t('view', 'View')}
+    </Button>
+  );
+};
+
+export default ViewPackageActionButton;

package/src/components/view-package/view-package-utils.ts

@@ -0,0 +1,9 @@
+import { launchWorkspace } from '@openmrs/esm-framework';
+import { type ExportPackage } from '../../types/index';
+
+export const launchViewPackageWorkspace = (exportPackage: ExportPackage) => {
+  launchWorkspace('view-package-workspace', {
+    workspaceTitle: exportPackage.name,
+    exportPackage,
+  });
+};

package/src/components/view-package/view-package.workspace.scss

@@ -0,0 +1,93 @@
+@use '@carbon/layout';
+@use '@carbon/type';
+@use '@openmrs/esm-styleguide/src/vars' as *;
+
+.container {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+.body {
+  flex: 1 1 auto;
+  overflow-y: auto;
+  padding: layout.$spacing-05;
+  display: flex;
+  flex-direction: column;
+  gap: layout.$spacing-06;
+}
+
+.section {
+  display: flex;
+  flex-direction: column;
+  gap: layout.$spacing-04;
+}
+
+.sectionLabel {
+  @include type.type-style('heading-compact-01');
+  color: $text-02;
+  text-transform: uppercase;
+  letter-spacing: 0.02em;
+}
+
+.detailList {
+  display: grid;
+  grid-template-columns: max-content 1fr;
+  gap: layout.$spacing-03 layout.$spacing-06;
+  margin: 0;
+}
+
+.detailKey {
+  @include type.type-style('body-compact-01');
+  color: $text-02;
+}
+
+.detailValue {
+  @include type.type-style('body-compact-01');
+  color: $text-02;
+  margin: 0;
+}
+
+.buildList {
+  display: flex;
+  flex-direction: column;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+.buildItem {
+  display: flex;
+  flex-direction: column;
+  gap: layout.$spacing-02;
+  padding: layout.$spacing-04 0;
+  border-top: 1px solid $ui-03;
+}
+
+.buildRow {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.buildVersion {
+  @include type.type-style('heading-compact-01');
+  color: $text-02;
+}
+
+.buildMeta {
+  @include type.type-style('body-compact-01');
+  color: $text-02;
+}
+
+.buildError {
+  @include type.type-style('body-compact-01');
+  color: $danger;
+  margin: 0;
+}
+
+.emptyBuilds {
+  @include type.type-style('body-compact-01');
+  color: $text-02;
+  margin: 0;
+}

package/src/components/view-package/view-package.workspace.test.tsx

@@ -0,0 +1,170 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { describe, it, expect, vi, beforeEach, type Mock } from 'vitest';
+import * as esmFramework from '@openmrs/esm-framework';
+import ViewPackageWorkspace from './view-package.workspace';
+import { usePackageBuilds } from '../../packages/packages.resource';
+import { type ExportPackage, type ExportPackageBuild } from '../../types';
+
+vi.mock('@openmrs/esm-framework', async (importOriginal) => {
+  const original = await importOriginal<typeof esmFramework>();
+  return {
+    ...original,
+    makeUrl: (path: string) => `${window.openmrsBase}${path}`,
+  };
+});
+
+vi.mock('../../packages/packages.resource', () => ({
+  usePackageBuilds: vi.fn(),
+}));
+
+const mockUsePackageBuilds = usePackageBuilds as Mock;
+const mockUseSession = vi.mocked(esmFramework.useSession);
+const mockUserHasAccess = vi.mocked(esmFramework.userHasAccess);
+
+const sessionWithUser = () =>
+  ({ user: { uuid: 'cc8507b8-7c9a-486b-85dc-b8f25ad1e4cc' } }) as unknown as esmFramework.Session;
+const mockCloseWorkspace = vi.fn();
+const mockCloseWorkspaceWithSavedChanges = vi.fn();
+const mockPromptBeforeClosing = vi.fn();
+
+const build = (overrides: Partial<ExportPackageBuild> = {}): ExportPackageBuild => ({
+  uuid: '23dbfd25-eec7-4f4e-b26c-d95324346ce3',
+  packageUuid: '361d69db-c018-4545-87a7-e987e8af9e85',
+  version: 2,
+  status: 'COMPLETED',
+  dateCreated: Date.now() - 15 * 60 * 1000,
+  dateStarted: Date.now() - 10 * 60 * 1000,
+  dateCompleted: Date.now() - 5 * 60 * 1000,
+  errorMessage: null,
+  downloadUrl: '/download/build-1',
+  manifest: null,
+  ...overrides,
+});
+
+const exportPackage: ExportPackage = {
+  uuid: '361d69db-c018-4545-87a7-e987e8af9e85',
+  name: 'Core reference data',
+  description: 'Some notes',
+  retired: false,
+  dateCreated: Date.now(),
+  entries: [
+    { domain: 'CONCEPTS', itemUuids: [] },
+    { domain: 'ENCOUNTER_TYPES', itemUuids: [] },
+  ],
+  latestBuild: null,
+};
+
+function mockBuilds(overrides: Partial<ReturnType<typeof usePackageBuilds>> = {}) {
+  mockUsePackageBuilds.mockReturnValue({
+    builds: [],
+    isLoading: false,
+    isValidating: false,
+    error: undefined,
+    mutate: vi.fn(),
+    ...overrides,
+  });
+}
+
+function renderWorkspace(pkg: ExportPackage = exportPackage) {
+  render(
+    <ViewPackageWorkspace
+      exportPackage={pkg}
+      closeWorkspace={mockCloseWorkspace}
+      closeWorkspaceWithSavedChanges={mockCloseWorkspaceWithSavedChanges}
+      promptBeforeClosing={mockPromptBeforeClosing}
+      setTitle={vi.fn()}
+    />,
+  );
+}
+
+describe('ViewPackageWorkspace', () => {
+  beforeEach(() => {
+    mockBuilds();
+    mockUseSession.mockReturnValue(sessionWithUser());
+    mockUserHasAccess.mockReturnValue(true);
+  });
+
+  it('renders the package domains as human-readable labels', () => {
+    renderWorkspace();
+
+    expect(screen.getByText('Concepts, Encounter types')).toBeInTheDocument();
+  });
+
+  it('shows "All domains" when the package has no entries', () => {
+    renderWorkspace({ ...exportPackage, entries: [] });
+
+    expect(screen.getByText('All domains')).toBeInTheDocument();
+  });
+
+  it('shows a loading indicator while builds are loading', () => {
+    mockBuilds({ isLoading: true });
+    renderWorkspace();
+
+    expect(screen.getByText('Loading builds…')).toBeInTheDocument();
+  });
+
+  it('shows an error state when the builds request fails', () => {
+    mockBuilds({ error: new Error('Boom') });
+    renderWorkspace();
+
+    expect(screen.getByText('Error State')).toBeInTheDocument();
+  });
+
+  it('shows an empty message when there are no builds', () => {
+    renderWorkspace();
+
+    expect(screen.getByText('No builds yet')).toBeInTheDocument();
+  });
+
+  it('renders each build with its version, status, and download link', () => {
+    mockBuilds({ builds: [build()] });
+    renderWorkspace();
+
+    expect(screen.getByText('Build 2')).toBeInTheDocument();
+    expect(screen.getByText('COMPLETED')).toBeInTheDocument();
+    expect(screen.getByText(/^Started .* ago$/)).toBeInTheDocument();
+    expect(screen.getByText(/^Completed .* ago$/)).toBeInTheDocument();
+    expect(screen.getByRole('link', { name: 'Download' })).toHaveAttribute(
+      'href',
+      `/openmrs/ws/rest/v1/metadataexport/builds/${build().uuid}/download`,
+    );
+  });
+
+  it('hides the download link from users without the Manage Metadata Export Packages privilege', () => {
+    mockUserHasAccess.mockReturnValue(false);
+    mockBuilds({ builds: [build()] });
+    renderWorkspace();
+
+    expect(screen.getByText('COMPLETED')).toBeInTheDocument();
+    expect(screen.queryByRole('link', { name: 'Download' })).not.toBeInTheDocument();
+    expect(mockUserHasAccess).toHaveBeenCalledWith('Manage Metadata Export Packages', expect.anything());
+  });
+
+  it('omits the download link for a build without a download URL', () => {
+    mockBuilds({ builds: [build({ status: 'QUEUED', downloadUrl: null, dateStarted: null, dateCompleted: null })] });
+    renderWorkspace();
+
+    expect(screen.getByText('QUEUED')).toBeInTheDocument();
+    expect(screen.getByText('Not started')).toBeInTheDocument();
+    expect(screen.queryByText(/^Completed/)).not.toBeInTheDocument();
+    expect(screen.queryByRole('link', { name: 'Download' })).not.toBeInTheDocument();
+  });
+
+  it('shows the failure reason for a failed build', () => {
+    mockBuilds({
+      builds: [build({ status: 'FAILED', downloadUrl: null, errorMessage: 'Serialization failed for concept 5497' })],
+    });
+    renderWorkspace();
+
+    expect(screen.getByText('FAILED')).toBeInTheDocument();
+    expect(screen.getByText('Serialization failed for concept 5497')).toBeInTheDocument();
+  });
+
+  it('does not show a failure reason for a non-failed build', () => {
+    mockBuilds({ builds: [build({ status: 'COMPLETED', errorMessage: 'stale error' })] });
+    renderWorkspace();
+
+    expect(screen.queryByText('stale error')).not.toBeInTheDocument();
+  });
+});

package/src/components/view-package/view-package.workspace.tsx

@@ -0,0 +1,114 @@
+import React, { useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { InlineLoading, Link, Tag } from '@carbon/react';
+import { Download } from '@carbon/react/icons';
+import {
+  type DefaultWorkspaceProps,
+  ErrorState,
+  formatDurationBetween,
+  makeUrl,
+  restBaseUrl,
+  useSession,
+  userHasAccess,
+} from '@openmrs/esm-framework';
+import { formatDomainLabel } from '../../domain-lookups/domain-lookups.resource';
+import { usePackageBuilds } from '../../packages/packages.resource';
+import { type ExportBuildStatus, type ExportPackage } from '../../types';
+import styles from './view-package.workspace.scss';
+
+interface ViewPackageWorkspaceProps extends DefaultWorkspaceProps {
+  exportPackage: ExportPackage;
+}
+
+const statusTagType: Record<ExportBuildStatus, 'gray' | 'blue' | 'green' | 'red'> = {
+  QUEUED: 'gray',
+  RUNNING: 'blue',
+  COMPLETED: 'green',
+  FAILED: 'red',
+};
+
+const ViewPackageWorkspace: React.FC<ViewPackageWorkspaceProps> = ({ exportPackage }) => {
+  const { t } = useTranslation();
+  const session = useSession();
+  const { builds, isLoading, error } = usePackageBuilds(exportPackage.uuid);
+
+  // Downloading a build hits a Manage-gated backend endpoint, so hide it from Get-only viewers.
+  const canManage = session.user ? userHasAccess('Manage Metadata Export Packages', session.user) : false;
+
+  const domainsLabel = useMemo(() => {
+    // An empty entries list means the package includes every registered domain.
+    const includesEveryDomain = exportPackage.entries.length === 0;
+    if (includesEveryDomain) {
+      return t('allDomains', 'All domains');
+    }
+
+    return exportPackage.entries.map((entry) => formatDomainLabel(entry.domain)).join(', ');
+  }, [exportPackage.entries, t]);
+
+  return (
+    <div className={styles.container}>
+      <div className={styles.body}>
+        <section className={styles.section}>
+          <span className={styles.sectionLabel}>{t('details', 'Details')}</span>
+          <dl className={styles.detailList}>
+            <dt className={styles.detailKey}>{t('domains', 'Domains')}</dt>
+            <dd className={styles.detailValue}>{domainsLabel}</dd>
+          </dl>
+        </section>
+
+        <section className={styles.section}>
+          <span className={styles.sectionLabel}>{t('builds', 'Builds')}</span>
+          {isLoading ? (
+            <InlineLoading description={t('loadingBuilds', 'Loading builds…')} />
+          ) : error ? (
+            <ErrorState error={error} headerTitle={t('builds', 'Builds')} />
+          ) : builds.length === 0 ? (
+            <p className={styles.emptyBuilds}>{t('noBuildsYet', 'No builds yet')}</p>
+          ) : (
+            <ul className={styles.buildList}>
+              {builds.map((build) => (
+                <li key={build.uuid} className={styles.buildItem}>
+                  <div className={styles.buildRow}>
+                    <span className={styles.buildVersion}>
+                      {t('buildVersion', 'Build {{version}}', { version: build.version })}
+                    </span>
+                    <Tag type={statusTagType[build.status]} size="sm">
+                      {t(build.status)}
+                    </Tag>
+                  </div>
+                  <div className={styles.buildRow}>
+                    <span className={styles.buildMeta}>
+                      {build.dateStarted
+                        ? t('startedAgo', 'Started {{time}} ago', { time: formatDurationBetween(build.dateStarted) })
+                        : t('notStarted', 'Not started')}
+                    </span>
+                    {build.dateCompleted && (
+                      <span className={styles.buildMeta}>
+                        {t('completedAgo', 'Completed {{time}} ago', {
+                          time: formatDurationBetween(build.dateCompleted),
+                        })}
+                      </span>
+                    )}
+                  </div>
+                  {build.status === 'FAILED' && build.errorMessage && (
+                    <p className={styles.buildError}>{build.errorMessage}</p>
+                  )}
+                  {canManage && build.downloadUrl && (
+                    <Link
+                      href={makeUrl(`${restBaseUrl}/metadataexport/builds/${build.uuid}/download`)}
+                      renderIcon={() => <Download size={16} />}
+                    >
+                      {t('download', 'Download')}
+                    </Link>
+                  )}
+                </li>
+              ))}
+            </ul>
+          )}
+        </section>
+      </div>
+    </div>
+  );
+};
+
+export default ViewPackageWorkspace;

package/src/index.ts

@@ -26,3 +26,8 @@ export const newPackageWorkspace = getAsyncLifecycle(
   () => import('./components/new-package/new-package.workspace'),
   options,
 );
+
+export const viewPackageWorkspace = getAsyncLifecycle(
+  () => import('./components/view-package/view-package.workspace'),
+  options,
+);

package/src/packages/packages.resource.ts

@@ -1,6 +1,6 @@
 import useSWR from 'swr';
 import { type FetchResponse, openmrsFetch, restBaseUrl } from '@openmrs/esm-framework';
-import { type ExportPackage, type ExportPackageRequest } from '../types/index';
+import type { ExportPackage, ExportPackageRequest, ExportPackageBuild } from '../types';
 
 export function useAllPackages(includeRetired = false) {
   const apiUrl = `${restBaseUrl}/metadataexport/packages?includeRetired=${includeRetired}`;
@@ -29,3 +29,18 @@ export function createPackage(
     signal: abortController?.signal,
   });
 }
+
+export function usePackageBuilds(uuid: string) {
+  const apiUrl = `${restBaseUrl}/metadataexport/packages/${uuid}/builds`;
+  const { data, error, isLoading, isValidating, mutate } = useSWR<FetchResponse<Array<ExportPackageBuild>>, Error>(
+    apiUrl,
+    openmrsFetch,
+  );
+  return {
+    builds: data?.data ?? [],
+    isLoading,
+    isValidating,
+    error,
+    mutate,
+  };
+}

package/src/routes.json

@@ -26,6 +26,14 @@
       "type": "form",
       "canMaximize": true,
       "width": "narrow"
+    },
+    {
+      "name": "view-package-workspace",
+      "component": "viewPackageWorkspace",
+      "title": "View package",
+      "type": "form",
+      "canMaximize": true,
+      "width": "narrow"
     }
   ]
 }