From 4c3e62cb8df83ffaf98cb7dacec640b623cc7c67 Mon Sep 17 00:00:00 2001
From: Anton Schwarz <anton.schwarz@cern.ch>
Date: Wed, 26 Jul 2023 12:29:51 +0200
Subject: [PATCH 1/2] Components: View Errors from within StreamedTable

Added `TableErrorstatus`, added `TableErrorreader` and appropriate
fixture

* `TableErrorreader` works together with `TableErrorstatus` in the
  `TableFooter`: an indication of errors is shown in the status "pill"
  (which sits among the pagination and fetchstatus), but the detailed
  view can be opened and is shown in `TableErrorreader`.
* Added a fixture `mockBaseVM` to mock the base view models (and
  especially whether they have errors or not: you can pass "none" |
  "some" | "all" and it will have some or all errors then.

Connected Tableerrorstatus and Tableerrorreader via the footer

Can close TableErrorreader from within the component
---
 .../StreamedTables/StreamedTable.stories.tsx  |  2 +-
 .../StreamedTables/StreamedTable.tsx          |  3 +-
 .../TableErrorreader.stories.tsx              | 16 ++++
 .../StreamedTables/TableErrorreader.tsx       | 68 ++++++++++++++++
 .../TableErrorstatus.stories.tsx              | 19 +++++
 .../StreamedTables/TableErrorstatus.tsx       | 78 +++++++++++++++++++
 .../StreamedTables/TableFetchstatus.tsx       |  6 +-
 .../StreamedTables/TableFooter.tsx            | 30 ++++++-
 src/component-library/outputtailwind.css      | 42 ++++++++++
 test/fixtures/table-fixtures.ts               | 11 +++
 10 files changed, 269 insertions(+), 6 deletions(-)
 create mode 100644 src/component-library/StreamedTables/TableErrorreader.stories.tsx
 create mode 100644 src/component-library/StreamedTables/TableErrorreader.tsx
 create mode 100644 src/component-library/StreamedTables/TableErrorstatus.stories.tsx
 create mode 100644 src/component-library/StreamedTables/TableErrorstatus.tsx

diff --git a/src/component-library/StreamedTables/StreamedTable.stories.tsx b/src/component-library/StreamedTables/StreamedTable.stories.tsx
index 8810df4f6..03eea5c2c 100644
--- a/src/component-library/StreamedTables/StreamedTable.stories.tsx
+++ b/src/component-library/StreamedTables/StreamedTable.stories.tsx
@@ -17,7 +17,7 @@ const columnHelper = createColumnHelper<DIDLong>()
 
 export const StreamedTable = Template.bind({});
 StreamedTable.args = {
-    tablecomdom: mockUseComDOM<DIDLong>(Array.from({length: 100}, () => createRandomDIDLong())),
+    tablecomdom: mockUseComDOM<DIDLong>(Array.from({length: 5}, () => createRandomDIDLong())),
     tablecolumns: [
         columnHelper.accessor(row => `${row.scope}:${row.name}`, {
             id: "did",
diff --git a/src/component-library/StreamedTables/StreamedTable.tsx b/src/component-library/StreamedTables/StreamedTable.tsx
index 8a1598f66..0cc015b0b 100644
--- a/src/component-library/StreamedTables/StreamedTable.tsx
+++ b/src/component-library/StreamedTables/StreamedTable.tsx
@@ -7,6 +7,7 @@ import { useEffect, useState } from "react";
 import { twMerge } from "tailwind-merge";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
 import { TableFooter } from "./TableFooter";
+import { BaseViewModel } from "@/lib/sdk/view-models";
 
 type StreamedTableProps<T> = JSX.IntrinsicElements["table"] & {
     tablecomdom: UseComDOM<T>
@@ -29,7 +30,7 @@ type StreamedTableProps<T> = JSX.IntrinsicElements["table"] & {
     }
 }
 
-export function StreamedTable<T>(props: StreamedTableProps<T>) {
+export function StreamedTable<T extends BaseViewModel>(props: StreamedTableProps<T>) {
     const { className, ...otherprops } = props
 
     const [rowSelection, setRowSelection] = useState<RowSelectionState>({})
diff --git a/src/component-library/StreamedTables/TableErrorreader.stories.tsx b/src/component-library/StreamedTables/TableErrorreader.stories.tsx
new file mode 100644
index 000000000..9565f6849
--- /dev/null
+++ b/src/component-library/StreamedTables/TableErrorreader.stories.tsx
@@ -0,0 +1,16 @@
+import { BaseViewModel } from "@/lib/sdk/view-models";
+import { StoryFn, Meta } from "@storybook/react";
+import { mockBaseVM, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { TableErrorreader as T } from "./TableErrorreader";
+
+export default {
+    title: 'Components/StreamedTables',
+    component: T,
+} as Meta<typeof T>;
+
+const Template: StoryFn<typeof T> = (args) => <T {...args} />;
+
+export const TableErrorreader = Template.bind({});
+TableErrorreader.args = {
+    comdom: mockUseComDOM<BaseViewModel>(Array.from({length: 5} , () => mockBaseVM("all"))),
+};
diff --git a/src/component-library/StreamedTables/TableErrorreader.tsx b/src/component-library/StreamedTables/TableErrorreader.tsx
new file mode 100644
index 000000000..8db79b4ce
--- /dev/null
+++ b/src/component-library/StreamedTables/TableErrorreader.tsx
@@ -0,0 +1,68 @@
+import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { H3 } from "@/component-library/Text/Headings/H3";
+import { twMerge } from "tailwind-merge";
+import { BaseViewModel } from "@/lib/sdk/view-models";
+import { Button } from "@/component-library/Button/Button";
+
+const TableErrorelement: React.FC<JSX.IntrinsicElements["div"] & {message: string}> = (
+    {message, ...props}
+) => {
+    const {className, ...otherprops} = props
+    return (
+        <div
+            className={twMerge(
+                "border rounded-md p-1",
+                "bg-white",
+                className ?? ""
+            )}
+        >
+            {message}
+        </div>
+    )
+}
+
+export const TableErrorreader: React.FC<JSX.IntrinsicElements["div"] & {
+    comdom: UseComDOM<BaseViewModel>,
+    showDetailedErrors: boolean,
+    setShowDetailedErrors: (show: boolean) => void,
+}> = (
+    {comdom, showDetailedErrors, setShowDetailedErrors, ...props}
+) => {
+    const {className, ...otherprops} = props
+    return (
+        <div
+            className={twMerge(
+                "border rounded-md p-1",
+                "bg-white dark:bg-gray-800",
+                className ?? ""
+            )}
+        >
+            <div
+                className={twMerge("flex flex-col sm:flex-row space-y-1 sm:space-y-0 sm:space-x-1 sm:justify-between")}
+            >
+                <H3 className="mt-2 mb-1">Errors</H3>
+                <Button
+                    label="Close"
+                    type="reset"
+                    onClick={(e) => {setShowDetailedErrors(!showDetailedErrors)}}
+                    className="w-24"
+                />
+            </div>
+            <div
+                className={twMerge(
+                    "bg-stone-100",
+                    "flex flex-col space-y-1 p-1 rounded-md",
+                    "h-48 overflow-y-scroll"
+                )}
+            >
+                {comdom.query.data.filter(vm => vm.status === "error").map((vm, i) => {return (
+                    <TableErrorelement
+                        key={i}
+                        message={vm.message ?? "Unknown Error"}
+                    />
+
+                )})}
+            </div>
+        </div>
+    );
+};
diff --git a/src/component-library/StreamedTables/TableErrorstatus.stories.tsx b/src/component-library/StreamedTables/TableErrorstatus.stories.tsx
new file mode 100644
index 000000000..e00064016
--- /dev/null
+++ b/src/component-library/StreamedTables/TableErrorstatus.stories.tsx
@@ -0,0 +1,19 @@
+import { BaseViewModel } from "@/lib/sdk/view-models";
+import { StoryFn, Meta } from "@storybook/react";
+import { TableErrorstatus as T } from "./TableErrorstatus";
+import { mockUseComDOM } from "test/fixtures/table-fixtures";
+
+export default {
+    title: 'Components/StreamedTables',
+    component: T,
+} as Meta<typeof T>;
+
+const Template: StoryFn<typeof T> = (args) => <T {...args} />;
+
+export const TableErrorstatus = Template.bind({});
+TableErrorstatus.args = {
+    comdom: mockUseComDOM<BaseViewModel>([{
+        status: "error",
+        message: "This is an error message"
+    }])
+};
diff --git a/src/component-library/StreamedTables/TableErrorstatus.tsx b/src/component-library/StreamedTables/TableErrorstatus.tsx
new file mode 100644
index 000000000..1ec5744ea
--- /dev/null
+++ b/src/component-library/StreamedTables/TableErrorstatus.tsx
@@ -0,0 +1,78 @@
+import { twMerge } from "tailwind-merge";
+import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { useState, useEffect } from "react";
+import { HiCheck, HiLifebuoy } from "react-icons/hi2";
+
+export const TableErrorstatus: React.FC<JSX.IntrinsicElements["form"] & { 
+    comdom: UseComDOM<any>,
+    showDetailedErrors: boolean,
+    setShowDetailedErrors: (show: boolean) => void,
+}> = ({
+    comdom,
+    showDetailedErrors,
+    setShowDetailedErrors,
+    ...props
+}) => {
+    const { className, ...otherprops } = props
+    const [numBadRows, setNumBadRows] = useState<number>(0)
+    useEffect(() => {
+        const data = comdom.query.data
+        if (data.length === 1 && data[0].status === "error") {
+            // currently this takes precedence over the individual errors
+            // expectation is that if only one element and it fails, it's a backend error
+            setNumBadRows(-1)
+        } else if (data.some((vm) => vm.status === "error")) {
+            // individual rows have failed
+            setNumBadRows(data.filter((vm) => vm.status === "error").length)
+        } else {
+            // no failures
+            setNumBadRows(0)
+        }
+    }, [comdom])
+    return (
+        <form
+            className={twMerge(
+                "p-1 rounded-md h-8",
+                "flex flex-row justify-center space-x-2 md:justify-between",
+                numBadRows === -1 ? "bg-red-200 text-red-800" : "",
+                numBadRows === 0 ? "bg-green-200 text-green-800" : "",
+                numBadRows > 0 ? "bg-amber-200 text-amber-800" : "",
+                className ?? ""
+            )}
+        >
+            <span className="font-semibold">
+                {numBadRows === -1 ? "Backend Error" : ""}
+                {numBadRows === 0 ? "No Errors" : ""}
+                {numBadRows === 1 ? "1 Error" : ""}
+                {numBadRows > 1 ? `${numBadRows} Errors` : ""}
+            </span>
+            <button
+                onClick={(e) => {
+                    e.preventDefault();
+                    setShowDetailedErrors(!showDetailedErrors);
+                }}
+                className={twMerge(
+                    "rounded-full",
+                    numBadRows === -1 ? "hover:bg-red-300 text-red-900" : "",
+                    numBadRows > 0 ? "hover:bg-amber-300 text-amber-900" : "",
+                )}
+                disabled={numBadRows === 0}
+                aria-label="Show Errors"
+            >
+                <HiLifebuoy
+                    className={twMerge(
+                        "text-2xl",
+                        numBadRows === 0 ? "hidden" : "",
+                    )}
+                    aria-label="Lifebuoy"
+                />
+                <HiCheck
+                    className={twMerge(
+                        "text-2xl",
+                        numBadRows !== 0 ? "hidden" : "",
+                    )}
+                />
+            </button>
+        </form>
+    );
+};
diff --git a/src/component-library/StreamedTables/TableFetchstatus.tsx b/src/component-library/StreamedTables/TableFetchstatus.tsx
index 4f9f2ef89..0f1325f69 100644
--- a/src/component-library/StreamedTables/TableFetchstatus.tsx
+++ b/src/component-library/StreamedTables/TableFetchstatus.tsx
@@ -78,7 +78,7 @@ export const TableFetchstatus: (
                     <StateButton
                         icon={<HiRefresh className="w-full h-full" />}
                         state={state}
-                        onClick={async (e) => { await comdom.start() }} // Request object is already stored in ComDOM
+                        onClick={async (e) => { e.preventDefault(); await comdom.start() }} // Request object is already stored in ComDOM
                     />
                 </div>
                 <div
@@ -90,12 +90,12 @@ export const TableFetchstatus: (
                     <StateButton
                         icon={<HiPause className="w-full h-full" />}
                         state={state}
-                        onClick={async (e) => { await comdom.pause() }}
+                        onClick={async (e) => { e.preventDefault(); await comdom.pause() }}
                     />
                     <StateButton
                         icon={<HiPlay className="w-full h-full" />}
                         state={state}
-                        onClick={async (e) => { await comdom.resume() }}
+                        onClick={async (e) => { e.preventDefault(); await comdom.resume() }}
                     />
                 </div>
             </form>
diff --git a/src/component-library/StreamedTables/TableFooter.tsx b/src/component-library/StreamedTables/TableFooter.tsx
index f6ccbc1f0..5ac01f703 100644
--- a/src/component-library/StreamedTables/TableFooter.tsx
+++ b/src/component-library/StreamedTables/TableFooter.tsx
@@ -4,6 +4,10 @@ import { twMerge } from "tailwind-merge";
 import { TablePaginationNav } from "./TablePaginationNav";
 import { TableFetchstatus } from "./TableFetchstatus";
 import { TableBreakout } from "./TableBreakout";
+import { TableErrorstatus } from "./TableErrorstatus";
+import { TableErrorreader } from "./TableErrorreader";
+import { BaseViewModel } from "@/lib/sdk/view-models";
+import { useState } from "react";
 
 /**
  * @param T the type of the data in the table
@@ -22,8 +26,9 @@ type TableFooterProps<T> = JSX.IntrinsicElements["tfoot"] & {
     stacked?: boolean // to save horizontal space
 }
 
-export function TableFooter<T>(props: TableFooterProps<T>) {
+export function TableFooter<T extends BaseViewModel>(props: TableFooterProps<T>) {
     const { stacked, className, ...otherprops } = props
+    const [showDetailedErrors, setShowDetailedErrors] = useState<boolean>(false)
 
     return (
         <tfoot
@@ -58,6 +63,15 @@ export function TableFooter<T>(props: TableFooterProps<T>) {
                             !props.stacked ? "flex flex-col space-y-1 md:space-y-0 items-center" : "flex flex-col space-y-1 items-center",
                         )}
                     >
+                        <TableErrorstatus
+                            className={twMerge(
+                                !props.stacked ? "md:absolute md:inset-y-0 md:left-0 md:w-36 lg:w-48" : "md:space-x-2 md:justify-center md:w-[400px]",
+                                "w-full"
+                            )}
+                            comdom={props.comdom}
+                            showDetailedErrors={showDetailedErrors}
+                            setShowDetailedErrors={setShowDetailedErrors}
+                        />
                         <div
                             className={twMerge(
                                 "w-full md:w-[400px]",
@@ -75,6 +89,20 @@ export function TableFooter<T>(props: TableFooterProps<T>) {
                     </div>
                 </td>
             </tr>
+            <tr aria-label="View the error messages">
+                <td
+                    colSpan={props.table.getVisibleLeafColumns().length}
+                    className={twMerge(
+                        showDetailedErrors ? "table-cell" : "hidden"
+                    )}
+                >
+                    <TableErrorreader
+                        comdom={props.comdom}
+                        showDetailedErrors={showDetailedErrors}
+                        setShowDetailedErrors={setShowDetailedErrors}
+                    />
+                </td>
+            </tr>
         </tfoot>
     );
 }
diff --git a/src/component-library/outputtailwind.css b/src/component-library/outputtailwind.css
index 901b0dc5d..75c4c89d4 100644
--- a/src/component-library/outputtailwind.css
+++ b/src/component-library/outputtailwind.css
@@ -657,6 +657,10 @@ html {
   margin-bottom: -0.5rem;
 }
 
+.mb-1 {
+  margin-bottom: 0.25rem;
+}
+
 .mb-2 {
   margin-bottom: 0.5rem;
 }
@@ -1164,6 +1168,10 @@ html {
   overflow-y: auto;
 }
 
+.overflow-y-scroll {
+  overflow-y: scroll;
+}
+
 .break-all {
   word-break: break-all;
 }
@@ -1805,6 +1813,11 @@ html {
   color: rgb(146 64 14 / var(--tw-text-opacity));
 }
 
+.text-amber-900 {
+  --tw-text-opacity: 1;
+  color: rgb(120 53 15 / var(--tw-text-opacity));
+}
+
 .text-black {
   --tw-text-opacity: 1;
   color: rgb(0 0 0 / var(--tw-text-opacity));
@@ -1910,6 +1923,11 @@ html {
   color: rgb(153 27 27 / var(--tw-text-opacity));
 }
 
+.text-red-900 {
+  --tw-text-opacity: 1;
+  color: rgb(127 29 29 / var(--tw-text-opacity));
+}
+
 .text-rose-800 {
   --tw-text-opacity: 1;
   color: rgb(159 18 57 / var(--tw-text-opacity));
@@ -2057,6 +2075,11 @@ html {
   cursor: wait;
 }
 
+.hover\:bg-amber-300:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(252 211 77 / var(--tw-bg-opacity));
+}
+
 .hover\:bg-amber-400:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(251 191 36 / var(--tw-bg-opacity));
@@ -2127,6 +2150,11 @@ html {
   background-color: rgb(254 202 202 / var(--tw-bg-opacity));
 }
 
+.hover\:bg-red-300:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(252 165 165 / var(--tw-bg-opacity));
+}
+
 .hover\:bg-red-600:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(220 38 38 / var(--tw-bg-opacity));
@@ -2749,6 +2777,16 @@ html {
     align-items: flex-end;
   }
 
+  .sm\:justify-between {
+    justify-content: space-between;
+  }
+
+  .sm\:space-x-1 > :not([hidden]) ~ :not([hidden]) {
+    --tw-space-x-reverse: 0;
+    margin-right: calc(0.25rem * var(--tw-space-x-reverse));
+    margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
+  }
+
   .sm\:space-x-2 > :not([hidden]) ~ :not([hidden]) {
     --tw-space-x-reverse: 0;
     margin-right: calc(0.5rem * var(--tw-space-x-reverse));
@@ -2782,6 +2820,10 @@ html {
     bottom: 0px;
   }
 
+  .md\:left-0 {
+    left: 0px;
+  }
+
   .md\:right-0 {
     right: 0px;
   }
diff --git a/test/fixtures/table-fixtures.ts b/test/fixtures/table-fixtures.ts
index 1684ff9ce..3566aa725 100644
--- a/test/fixtures/table-fixtures.ts
+++ b/test/fixtures/table-fixtures.ts
@@ -13,6 +13,7 @@ import {
 import { RSEAttribute, RSEProtocol } from '@/lib/infrastructure/data/view-model/rse';
 import { UseComDOM } from '@/lib/infrastructure/hooks/useComDOM';
 import { SubscriptionViewModel } from '@/lib/infrastructure/data/view-model/subscriptions';
+import { BaseViewModel } from '@/lib/sdk/view-models';
 
 export function mockUseComDOM<T>(data: T[]): UseComDOM<T> {
     return {
@@ -26,6 +27,16 @@ export function mockUseComDOM<T>(data: T[]): UseComDOM<T> {
     } as UseComDOM<T>
 }
 
+export function mockBaseVM(fail?: "none" | "some" | "all"): BaseViewModel {
+    const setting = fail ?? "none"
+    return {
+        status: setting === "none" ? "success" : (
+            setting === "some" ? faker.helpers.arrayElement(["success", "error"]) : "error"
+        ),
+        message: faker.lorem.words(3),
+    }
+}
+
 function createRandomScope(): string {
     return `user.${faker.person.firstName()}${faker.person.lastName()}`
 }

From 85498deec050ad69f0c33af5f264d7c9a918292f Mon Sep 17 00:00:00 2001
From: Anton Schwarz <anton.schwarz@cern.ch>
Date: Wed, 26 Jul 2023 19:29:17 +0200
Subject: [PATCH 2/2] Components: Replace core entities with viewmodels

wrote viewmodels to wrap the core entities in `BaseViewmodel`, added
fixtures.
---
 src/app/did/list/page.tsx                     |   4 +-
 src/app/did/page.tsx                          | 101 ------------------
 src/app/did/page/[scope]/[name]/page.tsx      |  32 ++----
 src/app/rse/list/page.tsx                     |   4 +-
 src/app/rse/page/[id]/page.tsx                |  10 +-
 src/app/rule/create/page.tsx                  |   8 +-
 src/app/rule/page/[id]/page.tsx               |  12 +--
 src/app/subscription/list/[account]/page.tsx  |   5 +-
 src/app/subscription/list/page.tsx            |   5 +-
 .../Pages/DID/DIDMetaView.stories.tsx         |   4 +-
 .../Pages/DID/ListDID.stories.tsx             |   6 +-
 .../Pages/DID/ListDIDTable.stories.tsx        |   4 +-
 .../Pages/DID/PageDID.stories.tsx             |  26 ++---
 src/component-library/Pages/DID/PageDID.tsx   |  25 ++---
 .../Pages/DID/PageDIDByType.stories.tsx       |   4 +-
 .../Pages/DID/PageDIDByType.tsx               |   8 +-
 .../DID/PageDIDDatasetReplicas.stories.tsx    |   4 +-
 .../Pages/DID/PageDIDDatasetReplicas.tsx      |  10 +-
 .../Pages/DID/PageDIDFilereplicas.stories.tsx |   4 +-
 .../Pages/DID/PageDIDFilereplicas.tsx         |   8 +-
 .../DID/PageDIDFilereplicasD.stories.tsx      |   7 +-
 .../Pages/DID/PageDIDFilereplicasD.tsx        |  11 +-
 .../Pages/DID/PageDIDMetadata.stories.tsx     |  12 +--
 .../Pages/DID/PageDIDMetadata.tsx             |   8 +-
 .../Pages/DID/PageDIDRules.stories.tsx        |   4 +-
 .../Pages/DID/PageDIDRules.tsx                |   8 +-
 .../Pages/RSE/ListRSE.stories.tsx             |   4 +-
 src/component-library/Pages/RSE/ListRSE.tsx   |   7 +-
 .../Pages/RSE/PageRSE.stories.tsx             |   8 +-
 src/component-library/Pages/RSE/PageRSE.tsx   |   8 +-
 .../Pages/RSE/PageRSEAttributes.stories.tsx   |   4 +-
 .../Pages/RSE/PageRSEAttributes.tsx           |   8 +-
 .../Pages/RSE/PageRSEProtocols.stories.tsx    |   4 +-
 .../Pages/RSE/PageRSEProtocols.tsx            |   6 +-
 .../Pages/Rule/CreateRule.stories.tsx         |   6 +-
 .../Pages/Rule/CreateRule.tsx                 |  16 +--
 .../Pages/Rule/CreateRuleDIDTable.stories.tsx |   4 +-
 .../Pages/Rule/CreateRuleDIDTable.tsx         |   9 +-
 .../Pages/Rule/CreateRuleRSETable.stories.tsx |   4 +-
 .../Pages/Rule/CreateRuleRSETable.tsx         |  10 +-
 .../Pages/Rule/ListRule.stories.tsx           |   4 +-
 src/component-library/Pages/Rule/ListRule.tsx |   5 +-
 .../Pages/Rule/PageRule.stories.tsx           |   9 +-
 src/component-library/Pages/Rule/PageRule.tsx |  17 +--
 .../ListSubscription.stories.tsx              |   4 +-
 .../Pages/Subscriptions/ListSubscription.tsx  |   8 +-
 .../StreamedTables/StreamedTable.stories.tsx  |   8 +-
 .../StreamedTables/StreamedTable.tsx          |   2 +-
 src/lib/core/entity/rucio.ts                  |   9 ++
 .../infrastructure/data/view-model/did.d.ts   |  13 ++-
 .../data/view-model/page-did.d.ts             |  13 ---
 .../infrastructure/data/view-model/rse.d.ts   |  10 +-
 .../infrastructure/data/view-model/rule.d.ts  |   7 ++
 .../data/view-model/subscriptions.ts          |   4 +-
 test/component/ListDID.test.tsx               |   8 +-
 test/component/PageRule.test.tsx              |   6 +-
 test/fixtures/table-fixtures.ts               |  80 +++++++++-----
 57 files changed, 273 insertions(+), 366 deletions(-)
 delete mode 100644 src/app/did/page.tsx
 create mode 100644 src/lib/infrastructure/data/view-model/rule.d.ts

diff --git a/src/app/did/list/page.tsx b/src/app/did/list/page.tsx
index ce9085021..ea81cc404 100644
--- a/src/app/did/list/page.tsx
+++ b/src/app/did/list/page.tsx
@@ -6,7 +6,7 @@ import { DIDMetaViewModel, DIDViewModel } from "@/lib/infrastructure/data/view-m
 import useComDOM from "@/lib/infrastructure/hooks/useComDOM";
 import { HTTPRequest, prepareRequestArgs } from "@/lib/sdk/http";
 import { useEffect, useState } from "react";
-import { createDIDMeta } from "test/fixtures/table-fixtures";
+import { fixtureDIDMetaViewModel } from "test/fixtures/table-fixtures";
 
 export default function Page() {
     const [didMetaQueryResponse, setDIDMetaQueryResponse] = useState<DIDMetaViewModel>({} as DIDMetaViewModel)
@@ -59,7 +59,7 @@ export default function Page() {
         true
     )
     useEffect(() => {
-        setDIDMetaQueryResponse({ status: 'success', ...createDIDMeta() })
+        setDIDMetaQueryResponse(fixtureDIDMetaViewModel())
     }, [])
     useEffect(() => {
         const setRequest = async () => {
diff --git a/src/app/did/page.tsx b/src/app/did/page.tsx
deleted file mode 100644
index d4f09386b..000000000
--- a/src/app/did/page.tsx
+++ /dev/null
@@ -1,101 +0,0 @@
-'use client';
-import { PageDID as PageDIDStory } from '@/component-library/Pages/DID/PageDID';
-import { DIDMeta } from "@/lib/core/entity/rucio";
-import { FilereplicaState, FilereplicaStateD } from '@/lib/infrastructure/data/view-model/page-did';
-import useComDOM from "@/lib/infrastructure/hooks/useComDOM";
-import { useEffect, useState } from "react";
-import { createDIDDatasetReplicas, createDIDMeta, createDIDRules, mockUseComDOM } from 'test/fixtures/table-fixtures';
-import { DID } from '@/lib/core/entity/rucio';
-import { HTTPRequest } from "@/lib/sdk/http";
-
-
-export default function PageDID() {
-    const [didMeta, setDIDMeta] = useState<DIDMeta>({} as DIDMeta)
-    const [fromDidList, setFromDidList] = useState<string>("yosearch")
-    useEffect(() => {
-        setDIDMeta(createDIDMeta())
-    }, [])
-
-    const didParentsComDOM = useComDOM<DID>(
-        'page-did-parents-query',
-        [],
-        false,
-        Infinity,
-        200,
-        true
-    )
-    const didContentsComDOM = useComDOM<DID>(
-        'page-did-contents-query', [], false, Infinity, 200, true
-    )
-    const didFileReplicasComDOM = useComDOM<FilereplicaState>(
-        'page-did-filereplicas-query', [], false, Infinity, 200, true
-    )
-    const didFileReplicasDComDOM = useComDOM<FilereplicaStateD>(
-        'page-did-filereplicas-d-query', [], false, Infinity, 200, true
-    )
-    useEffect(() => {
-        const setRequests = async () => {
-            const requestParents: HTTPRequest = {
-                url: new URL('http://localhost:3000/api/listdids'),
-                method: 'GET',
-                headers: new Headers({
-                    'Content-Type': 'application/json',
-                } as HeadersInit),
-                body: null,
-            }
-            await didParentsComDOM.setRequest(requestParents)
-            const requestContents: HTTPRequest = {
-                url: new URL('http://localhost:3000/api/listdids'),
-                method: 'GET',
-                headers: new Headers({
-                    'Content-Type': 'application/json',
-                } as HeadersInit),
-                body: null,
-            }
-            await didContentsComDOM.setRequest(requestContents)
-            const requestsFilereplicas: HTTPRequest = {
-                url: new URL('http://localhost:3000/api/filereplicastate'),
-                method: 'GET',
-                headers: new Headers({
-                    'Content-Type': 'application/json',
-                } as HeadersInit),
-                body: null,
-            }
-            await didFileReplicasComDOM.setRequest(requestsFilereplicas)
-            const requestsFilereplicasD: HTTPRequest = {
-                url: new URL('http://localhost:3000/api/filereplicastate-d'),
-                method: 'GET',
-                headers: new Headers({
-                    'Content-Type': 'application/json',
-                } as HeadersInit),
-                body: null,
-            }
-            await didFileReplicasDComDOM.setRequest(requestsFilereplicasD)
-        }
-        setRequests()
-    }, [])
-    const didMetadataComDOM = mockUseComDOM([
-        { key: "bernd", value: "das brot" },
-        { key: "kika", value: "der sender" },
-        { key: "kikaninchen", value: "das tier" },
-        { key: "my birthday", value: (new Date(2021, 3)).toISOString() },
-        { key: "am_i_anton", value: false },
-        { key: "R1-tastefactor", value: 3.142 },
-        { key: "hello", value: null },
-    ])
-    const didRulesComDOM = mockUseComDOM(Array.from({ length: 100 }, (_, i) => createDIDRules()))
-    const didDatasetReplicasComDOM = mockUseComDOM(Array.from({ length: 100 }, (_, i) => createDIDDatasetReplicas()))
-    return (
-        <PageDIDStory
-            didMeta={didMeta}
-            fromDidList={fromDidList}
-            didParentsComDOM={didParentsComDOM}
-            didMetadataComDOM={didMetadataComDOM}
-            didFileReplicasComDOM={didFileReplicasComDOM}
-            didFileReplicasDComDOM={didFileReplicasDComDOM}
-            didRulesComDOM={didRulesComDOM}
-            didContentsComDOM={didContentsComDOM}
-            didDatasetReplicasComDOM={didDatasetReplicasComDOM}
-        />
-    )
-}
\ No newline at end of file
diff --git a/src/app/did/page/[scope]/[name]/page.tsx b/src/app/did/page/[scope]/[name]/page.tsx
index 48b51e5bd..c40c78f62 100644
--- a/src/app/did/page/[scope]/[name]/page.tsx
+++ b/src/app/did/page/[scope]/[name]/page.tsx
@@ -1,30 +1,28 @@
 'use client';
 import { PageDID as PageDIDStory } from '@/component-library/Pages/DID/PageDID';
-import { DIDMeta } from "@/lib/core/entity/rucio";
-import { FilereplicaState, FilereplicaStateD } from '@/lib/infrastructure/data/view-model/page-did';
 import useComDOM from "@/lib/infrastructure/hooks/useComDOM";
 import { useEffect, useState } from "react";
-import { createDIDDatasetReplicas, createDIDMeta, createDIDRules, mockUseComDOM } from 'test/fixtures/table-fixtures';
-import { DID } from '@/lib/core/entity/rucio';
+import { fixtureDIDDatasetReplicasViewModel, fixtureDIDMetaViewModel, fixtureDIDRulesViewModel, mockUseComDOM, fixtureDIDKeyValuePairsViewModel } from 'test/fixtures/table-fixtures';
 import { HTTPRequest } from "@/lib/sdk/http";
+import { DIDMetaViewModel, DIDViewModel, FilereplicaStateDViewModel, FilereplicaStateViewModel } from '@/lib/infrastructure/data/view-model/did';
 
 export default function Page({ params }: { params: { scope: string, name: string } }) {
-    const [didMeta, setDIDMeta] = useState<DIDMeta>({} as DIDMeta)
+    const [didMeta, setDIDMeta] = useState<DIDMetaViewModel>({} as DIDMetaViewModel)
     const [fromDidList, setFromDidList] = useState<string>("yosearch")
     useEffect(() => {
-        setDIDMeta({ ...createDIDMeta(), name: params.name, scope: params.scope, } as DIDMeta)
+        setDIDMeta(fixtureDIDMetaViewModel())
     }, [])
 
-    const didParentsComDOM = useComDOM<DID>(
+    const didParentsComDOM = useComDOM<DIDViewModel>(
         'page-did-parents-query', [], false, Infinity, 200, true
     )
-    const didContentsComDOM = useComDOM<DID>(
+    const didContentsComDOM = useComDOM<DIDViewModel>(
         'page-did-contents-query', [], false, Infinity, 200, true
     )
-    const didFileReplicasComDOM = useComDOM<FilereplicaState>(
+    const didFileReplicasComDOM = useComDOM<FilereplicaStateViewModel>(
         'page-did-filereplicas-query', [], false, Infinity, 200, true
     )
-    const didFileReplicasDComDOM = useComDOM<FilereplicaStateD>(
+    const didFileReplicasDComDOM = useComDOM<FilereplicaStateDViewModel>(
         'page-did-filereplicas-d-query', [], false, Infinity, 200, true
     )
     useEffect(() => {
@@ -68,17 +66,9 @@ export default function Page({ params }: { params: { scope: string, name: string
         }
         setRequests()
     }, [])
-    const didMetadataComDOM = mockUseComDOM([
-        { key: "bernd", value: "das brot" },
-        { key: "kika", value: "der sender" },
-        { key: "kikaninchen", value: "das tier" },
-        { key: "my birthday", value: (new Date(2021, 3)).toISOString() },
-        { key: "am_i_anton", value: false },
-        { key: "R1-tastefactor", value: 3.142 },
-        { key: "hello", value: null },
-    ])
-    const didRulesComDOM = mockUseComDOM(Array.from({ length: 100 }, (_, i) => createDIDRules()))
-    const didDatasetReplicasComDOM = mockUseComDOM(Array.from({ length: 100 }, (_, i) => createDIDDatasetReplicas()))
+    const didMetadataComDOM = mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureDIDKeyValuePairsViewModel()))
+    const didRulesComDOM = mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureDIDRulesViewModel()))
+    const didDatasetReplicasComDOM = mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureDIDDatasetReplicasViewModel()))
     return (
         <PageDIDStory
             didMeta={didMeta}
diff --git a/src/app/rse/list/page.tsx b/src/app/rse/list/page.tsx
index 9fb5d0ded..c17bc6891 100644
--- a/src/app/rse/list/page.tsx
+++ b/src/app/rse/list/page.tsx
@@ -1,10 +1,10 @@
 'use client';
 import { ListRSE as ListRSEStory } from "@/component-library/Pages/RSE/ListRSE";
-import { mockUseComDOM, createRSE } from "test/fixtures/table-fixtures";
+import { mockUseComDOM, fixtureRSEViewModel } from "test/fixtures/table-fixtures";
 export default function Page() {
     return (
         <ListRSEStory
-            comdom={mockUseComDOM(Array.from({ length: 100 }, () => createRSE()))} // replace with ViewModel
+            comdom={mockUseComDOM(Array.from({ length: 100 }, () => fixtureRSEViewModel()))} // replace with ViewModel
         />
     )
 }
diff --git a/src/app/rse/page/[id]/page.tsx b/src/app/rse/page/[id]/page.tsx
index 1c481440b..204932b72 100644
--- a/src/app/rse/page/[id]/page.tsx
+++ b/src/app/rse/page/[id]/page.tsx
@@ -1,15 +1,15 @@
 'use client';
 import { PageRSE as PageRSEStory } from "@/component-library/Pages/RSE/PageRSE";
 import { RSEBlockState } from "@/lib/core/entity/rucio";
-import { createRSE, mockUseComDOM } from "test/fixtures/table-fixtures";
-import { createRSEProtocol, createRSEAttribute } from "test/fixtures/table-fixtures";
+import { fixtureRSEViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureRSEProtocolViewModel, fixtureRSEAttributeViewModel } from "test/fixtures/table-fixtures";
 export default function Page({ params }: { params: { id: string } }) {
     return (
         <PageRSEStory
-            rse={{ ...createRSE(), id: params.id }}
+            rse={{ ...fixtureRSEViewModel(), id: params.id }}
             rseblockstate={7 as RSEBlockState}
-            protocolscomdom={mockUseComDOM(Array.from({ length: 20 }, (_, i) => createRSEProtocol()))}
-            attributescomdom={mockUseComDOM(Array.from({ length: 20 }, (_, i) => createRSEAttribute()))}
+            protocolscomdom={mockUseComDOM(Array.from({ length: 20 }, (_, i) => fixtureRSEProtocolViewModel()))}
+            attributescomdom={mockUseComDOM(Array.from({ length: 20 }, (_, i) => fixtureRSEAttributeViewModel()))}
         />
     )
 }
diff --git a/src/app/rule/create/page.tsx b/src/app/rule/create/page.tsx
index 481c128cc..c8d88932f 100644
--- a/src/app/rule/create/page.tsx
+++ b/src/app/rule/create/page.tsx
@@ -1,7 +1,7 @@
 'use client';
 import { CreateRule as CreateRuleStory } from "@/component-library/Pages/Rule/CreateRule";
-import { RSEAccountUsageLimit } from "@/lib/core/entity/rucio";
-import { DIDLong } from "@/lib/core/entity/rucio"
+import { RSEAccountUsageLimitViewModel } from "@/lib/infrastructure/data/view-model/rse";
+import { DIDLongViewModel } from "@/lib/infrastructure/data/view-model/did";
 import {
     CreateRuleQuery,
     TypedDIDValidationQuery, TypedDIDValidationResponse,
@@ -36,7 +36,7 @@ export default function CreateRule() {
     }
 
 
-    const DIDSearchComDOM = useComDOM<DIDLong>(
+    const DIDSearchComDOM = useComDOM<DIDLongViewModel>(
         'create-rule-page-did-query',
         [],
         false,
@@ -45,7 +45,7 @@ export default function CreateRule() {
         true
     )
 
-    const RSEComDOM = useComDOM<RSEAccountUsageLimit>(
+    const RSEComDOM = useComDOM<RSEAccountUsageLimitViewModel>(
         'create-rule-page-rse-query',
         [],
         false,
diff --git a/src/app/rule/page/[id]/page.tsx b/src/app/rule/page/[id]/page.tsx
index d031907a0..e8c4f1a2a 100644
--- a/src/app/rule/page/[id]/page.tsx
+++ b/src/app/rule/page/[id]/page.tsx
@@ -1,13 +1,13 @@
 'use client';
-import { PageRule as PageRuleStory, RulePageLockEntry } from "@/component-library/Pages/Rule/PageRule";
-import { RuleMeta } from "@/lib/core/entity/rucio";
-import { createRuleMeta } from "test/fixtures/table-fixtures";
+import { PageRule as PageRuleStory } from "@/component-library/Pages/Rule/PageRule";
+import { fixtureRuleMetaViewModel } from "test/fixtures/table-fixtures";
 import { useState, useEffect } from "react";
 import useComDOM from "@/lib/infrastructure/hooks/useComDOM";
 import { HTTPRequest } from "@/lib/sdk/http";
+import { RuleMetaViewModel, RulePageLockEntryViewModel } from "@/lib/infrastructure/data/view-model/rule";
 
 export default function PageRule({ params }: { params: { id: string } }) {
-    const comDOM = useComDOM<RulePageLockEntry>(
+    const comDOM = useComDOM<RulePageLockEntryViewModel>(
         "rule-page-lock-query",
         [],
         false,
@@ -15,9 +15,9 @@ export default function PageRule({ params }: { params: { id: string } }) {
         50,
         true
     )
-    const [meta, setMeta] = useState<RuleMeta>({} as RuleMeta)
+    const [meta, setMeta] = useState<RuleMetaViewModel>({} as RuleMetaViewModel)
     useEffect(() => {
-        setMeta({...createRuleMeta(), id: params.id})
+        setMeta({...fixtureRuleMetaViewModel(), id: params.id})
     }, [])
     useEffect(() => {
         const runQuery = async () => {
diff --git a/src/app/subscription/list/[account]/page.tsx b/src/app/subscription/list/[account]/page.tsx
index 8dff8eff8..71f8db0f3 100644
--- a/src/app/subscription/list/[account]/page.tsx
+++ b/src/app/subscription/list/[account]/page.tsx
@@ -1,12 +1,11 @@
 'use client';
-import { SubscriptionRuleStates } from "@/lib/core/entity/rucio";
 import { ListSubscription as ListSubscriptionStory } from "@/component-library/Pages/Subscriptions/ListSubscription";
 import { Component, useEffect, useState } from "react";
-import { createSubscriptionRuleStates } from "test/fixtures/table-fixtures";
 import useComDOM from "@/lib/infrastructure/hooks/useComDOM";
+import { SubscriptionRuleStatesViewModel } from "@/lib/infrastructure/data/view-model/subscriptions";
 
 export default function ListSubscription({ params }: { params: { account: string }}) {
-    const ComDOM = useComDOM<SubscriptionRuleStates>(
+    const ComDOM = useComDOM<SubscriptionRuleStatesViewModel>(
         "subscription-rule-states-query",
         [],
         false,
diff --git a/src/app/subscription/list/page.tsx b/src/app/subscription/list/page.tsx
index 8dff8eff8..71f8db0f3 100644
--- a/src/app/subscription/list/page.tsx
+++ b/src/app/subscription/list/page.tsx
@@ -1,12 +1,11 @@
 'use client';
-import { SubscriptionRuleStates } from "@/lib/core/entity/rucio";
 import { ListSubscription as ListSubscriptionStory } from "@/component-library/Pages/Subscriptions/ListSubscription";
 import { Component, useEffect, useState } from "react";
-import { createSubscriptionRuleStates } from "test/fixtures/table-fixtures";
 import useComDOM from "@/lib/infrastructure/hooks/useComDOM";
+import { SubscriptionRuleStatesViewModel } from "@/lib/infrastructure/data/view-model/subscriptions";
 
 export default function ListSubscription({ params }: { params: { account: string }}) {
-    const ComDOM = useComDOM<SubscriptionRuleStates>(
+    const ComDOM = useComDOM<SubscriptionRuleStatesViewModel>(
         "subscription-rule-states-query",
         [],
         false,
diff --git a/src/component-library/Pages/DID/DIDMetaView.stories.tsx b/src/component-library/Pages/DID/DIDMetaView.stories.tsx
index a4cee7af3..a4795fbce 100644
--- a/src/component-library/Pages/DID/DIDMetaView.stories.tsx
+++ b/src/component-library/Pages/DID/DIDMetaView.stories.tsx
@@ -1,6 +1,6 @@
 import { StoryFn, Meta } from "@storybook/react";
 import { DIDMetaView as DM } from "./DIDMetaView";
-import { createDIDMeta } from "test/fixtures/table-fixtures";
+import { fixtureDIDMetaViewModel } from "test/fixtures/table-fixtures";
 
 export default {
     title: "Components/Pages/DID",
@@ -10,6 +10,6 @@ export default {
 const Template: StoryFn<typeof DM> = (args) => <DM {...args} />;
 export const DIDMetaView = Template.bind({});
 DIDMetaView.args = {
-    data: {status: "success", ...createDIDMeta()},
+    data: fixtureDIDMetaViewModel(),
     show: true,
 }
diff --git a/src/component-library/Pages/DID/ListDID.stories.tsx b/src/component-library/Pages/DID/ListDID.stories.tsx
index d9237f247..9f08d6250 100644
--- a/src/component-library/Pages/DID/ListDID.stories.tsx
+++ b/src/component-library/Pages/DID/ListDID.stories.tsx
@@ -1,6 +1,6 @@
 import { StoryFn, Meta } from '@storybook/react';
 import { ListDID as LD } from './ListDID';
-import { createDIDMeta, createDID, mockUseComDOM } from 'test/fixtures/table-fixtures';
+import { fixtureDIDMetaViewModel, fixtureDIDViewModel, mockUseComDOM } from 'test/fixtures/table-fixtures';
 
 export default {
     title: 'Components/Pages/DID',
@@ -11,7 +11,7 @@ const Template: StoryFn<typeof LD> = (args) => <LD {...args} />;
 
 export const ListDID = Template.bind({});
 ListDID.args = {
-    comdom: mockUseComDOM(Array.from({length: 100}, () => createDID())),
+    comdom: mockUseComDOM(Array.from({length: 100}, () => fixtureDIDViewModel())),
     didMetaQuery: (scope: string, name: string) => { },
-    didMetaQueryResponse: {status: "success", ...createDIDMeta()}
+    didMetaQueryResponse: fixtureDIDMetaViewModel()
 }
diff --git a/src/component-library/Pages/DID/ListDIDTable.stories.tsx b/src/component-library/Pages/DID/ListDIDTable.stories.tsx
index 766e6dfce..5c75ebe63 100644
--- a/src/component-library/Pages/DID/ListDIDTable.stories.tsx
+++ b/src/component-library/Pages/DID/ListDIDTable.stories.tsx
@@ -1,6 +1,6 @@
 import { StoryFn, Meta } from "@storybook/react";
 import { ListDIDTable as L } from "./ListDIDTable";
-import { createDID, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureDIDViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { DID } from "@/lib/core/entity/rucio";
 
 export default {
@@ -12,6 +12,6 @@ const Template: StoryFn<typeof L> = (args) => <L {...args} />;
 
 export const ListDIDTable = Template.bind({});
 ListDIDTable.args = {
-    comdom: mockUseComDOM(Array.from({length: 100}, () => createDID())),
+    comdom: mockUseComDOM(Array.from({length: 100}, () => fixtureDIDViewModel())),
     selectionFunc: (data: DID[]) => {console.info("ListDIDTable", data)}
 };
diff --git a/src/component-library/Pages/DID/PageDID.stories.tsx b/src/component-library/Pages/DID/PageDID.stories.tsx
index 7b149ae75..99198e66a 100644
--- a/src/component-library/Pages/DID/PageDID.stories.tsx
+++ b/src/component-library/Pages/DID/PageDID.stories.tsx
@@ -1,7 +1,7 @@
 import { StoryFn, Meta } from "@storybook/react";
 import { PageDID as PD } from "./PageDID";
 
-import { createDIDMeta, mockUseComDOM, createDIDRules, createDID, createDIDDatasetReplicas, createFileReplicaState, createFileReplicaStateD } from "test/fixtures/table-fixtures";
+import { fixtureDIDMetaViewModel, mockUseComDOM, fixtureDIDRulesViewModel, fixtureDIDViewModel, fixtureDIDDatasetReplicasViewModel, fixtureFilereplicaStateViewModel, fixtureFilereplicaStateDViewModel, fixtureDIDKeyValuePairsViewModel } from "test/fixtures/table-fixtures";
 
 export default {
     title: "Components/Pages/DID",
@@ -11,25 +11,17 @@ export default {
 const Template: StoryFn<typeof PD> = (args) => <PD {...args} />;
 export const PageDID = Template.bind({});
 PageDID.args = {
-    didMeta: createDIDMeta(),
+    didMeta: fixtureDIDMetaViewModel(),
     fromDidList: "yosearch",
     // Parent DIDs [FILE]
-    didParentsComDOM: mockUseComDOM(Array.from({length: 100}, (_, i) => createDID())),
+    didParentsComDOM: mockUseComDOM(Array.from({length: 100}, (_, i) => fixtureDIDViewModel())),
     // DID Metadata
-    didMetadataComDOM: mockUseComDOM([
-        { key: "bernd", value: "das brot" },
-        { key: "kika", value: "der sender" },
-        { key: "kikaninchen", value: "das tier" },
-        { key: "my birthday", value: (new Date(2021, 3)).toISOString() },
-        { key: "am_i_anton", value: false },
-        { key: "R1-tastefactor", value: 3.142 },
-        { key: "hello", value: null },
-    ]),
+    didMetadataComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureDIDKeyValuePairsViewModel())),
     // Filereplicas
-    didFileReplicasComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => createFileReplicaState())),
-    didFileReplicasDComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => createFileReplicaStateD())),
-    didRulesComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => createDIDRules())),
+    didFileReplicasComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureFilereplicaStateViewModel())),
+    didFileReplicasDComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureFilereplicaStateDViewModel())),
+    didRulesComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureDIDRulesViewModel())),
     // Contents
-    didContentsComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => createDID())),
-    didDatasetReplicasComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => createDIDDatasetReplicas()))
+    didContentsComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureDIDViewModel())),
+    didDatasetReplicasComDOM: mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureDIDDatasetReplicasViewModel()))
 }
\ No newline at end of file
diff --git a/src/component-library/Pages/DID/PageDID.tsx b/src/component-library/Pages/DID/PageDID.tsx
index c0700c034..0e0658bbd 100644
--- a/src/component-library/Pages/DID/PageDID.tsx
+++ b/src/component-library/Pages/DID/PageDID.tsx
@@ -11,36 +11,33 @@ import { twMerge } from "tailwind-merge";
 import React, { useEffect, useState } from "react";
 
 // DTO etc
-import { DIDMeta, DIDType } from "@/lib/core/entity/rucio";
+import { DIDType } from "@/lib/core/entity/rucio";
 import { PageDIDMetadata } from "./PageDIDMetadata";
 import { PageDIDFilereplicas } from "./PageDIDFilereplicas";
 import { PageDIDFilereplicasD } from "./PageDIDFilereplicasD";
 import { PageDIDRules } from "./PageDIDRules";
-import {
-    DIDContents, DIDDatasetReplicas, DIDKeyValuePairs, DIDParents, DIDRules,
-    FilereplicaState, FilereplicaStateD
-} from "@/lib/infrastructure/data/view-model/page-did";
 import { PageDIDByType } from "./PageDIDByType";
 import { PageDIDDatasetReplicas } from "./PageDIDDatasetReplicas";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { DIDDatasetReplicasViewModel, DIDKeyValuePairsViewModel, DIDMetaViewModel, DIDRulesViewModel, DIDViewModel, FilereplicaStateDViewModel, FilereplicaStateViewModel } from "@/lib/infrastructure/data/view-model/did";
 
 export interface PageDIDPageProps {
-    didMeta: DIDMeta;
+    didMeta: DIDMetaViewModel;
     fromDidList?: string; // if coming from DIDList, this will be the DIDList's query
     // Parent DIDs [FILE]
-    didParentsComDOM: UseComDOM<DIDParents>
+    didParentsComDOM: UseComDOM<DIDViewModel>
     // Metadata [BOTH]
-    didMetadataComDOM: UseComDOM<DIDKeyValuePairs>
+    didMetadataComDOM: UseComDOM<DIDKeyValuePairsViewModel>
     // File Replica States [FILE]
-    didFileReplicasComDOM: UseComDOM<FilereplicaState>
+    didFileReplicasComDOM: UseComDOM<FilereplicaStateViewModel>
     // File Replica States [DATASET]
-    didFileReplicasDComDOM: UseComDOM<FilereplicaStateD>
+    didFileReplicasDComDOM: UseComDOM<FilereplicaStateDViewModel>
     // Rule State [DATASET]
-    didRulesComDOM: UseComDOM<DIDRules>
+    didRulesComDOM: UseComDOM<DIDRulesViewModel>
     // Contents [COLLECTION]
-    didContentsComDOM: UseComDOM<DIDContents>
+    didContentsComDOM: UseComDOM<DIDViewModel>
     // Dataset Replica States [DATASET]
-    didDatasetReplicasComDOM: UseComDOM<DIDDatasetReplicas>
+    didDatasetReplicasComDOM: UseComDOM<DIDDatasetReplicasViewModel>
 }
 
 
@@ -106,7 +103,7 @@ export const PageDID = (
                         "min-h-0 w-full"
                     )}
                 >
-                    <DIDMetaView data={{status: "success", ...props.didMeta}} show horizontal />
+                    <DIDMetaView data={props.didMeta} show horizontal />
                 </div>
             </Heading>
 
diff --git a/src/component-library/Pages/DID/PageDIDByType.stories.tsx b/src/component-library/Pages/DID/PageDIDByType.stories.tsx
index 8d11edfee..e5cc19bc0 100644
--- a/src/component-library/Pages/DID/PageDIDByType.stories.tsx
+++ b/src/component-library/Pages/DID/PageDIDByType.stories.tsx
@@ -1,5 +1,5 @@
 import { StoryFn, Meta } from "@storybook/react";
-import { createRandomDIDLong, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureDIDViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { PageDIDByType as P } from "./PageDIDByType";
 
 export default {
@@ -12,6 +12,6 @@ const Template: StoryFn<typeof P> = (args) => <P {...args} />;
 export const PageDIDByType = Template.bind({});
 PageDIDByType.args = {
     showDIDType: true,
-    comdom: mockUseComDOM(Array.from({length: 100}, (_, i) => createRandomDIDLong()))
+    comdom: mockUseComDOM(Array.from({length: 100}, (_, i) => fixtureDIDViewModel()))
 
 };
diff --git a/src/component-library/Pages/DID/PageDIDByType.tsx b/src/component-library/Pages/DID/PageDIDByType.tsx
index 5f5f6f520..5a414b177 100644
--- a/src/component-library/Pages/DID/PageDIDByType.tsx
+++ b/src/component-library/Pages/DID/PageDIDByType.tsx
@@ -1,4 +1,3 @@
-import { DIDContents } from "@/lib/infrastructure/data/view-model/page-did";
 import { twMerge } from "tailwind-merge";
 import { createColumnHelper } from "@tanstack/react-table"
 
@@ -10,14 +9,15 @@ import { TableFilterString } from "../../StreamedTables/TableFilterString";
 import { TableFilterDiscrete } from "../../StreamedTables/TableFilterDiscrete";
 import { HiDotsHorizontal } from "react-icons/hi"
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { DIDViewModel } from "@/lib/infrastructure/data/view-model/did";
 
 export const PageDIDByType = (
     props: {
-        comdom: UseComDOM<DIDContents>,
+        comdom: UseComDOM<DIDViewModel>,
         showDIDType?: boolean,
     }
 ) => {
-    const columnHelper = createColumnHelper<DIDContents>()
+    const columnHelper = createColumnHelper<DIDViewModel>()
     const tablecolumns: any[] = [
         columnHelper.accessor(row => `${row.scope}:${row.name}`, {
             id: "did",
@@ -55,7 +55,7 @@ export const PageDIDByType = (
     ]
 
     return (
-        <StreamedTable
+        <StreamedTable<DIDViewModel>
             tablecomdom={props.comdom}
             tablecolumns={tablecolumns}
             tablestyling={{}}
diff --git a/src/component-library/Pages/DID/PageDIDDatasetReplicas.stories.tsx b/src/component-library/Pages/DID/PageDIDDatasetReplicas.stories.tsx
index 5b925161b..c26b3961c 100644
--- a/src/component-library/Pages/DID/PageDIDDatasetReplicas.stories.tsx
+++ b/src/component-library/Pages/DID/PageDIDDatasetReplicas.stories.tsx
@@ -1,5 +1,5 @@
 import { StoryFn, Meta } from "@storybook/react";
-import { createDIDDatasetReplicas, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureDIDDatasetReplicasViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { PageDIDDatasetReplicas as P } from "./PageDIDDatasetReplicas";
 
 export default {
@@ -11,5 +11,5 @@ const Template: StoryFn<typeof P> = (args) => <P {...args} />;
 
 export const PageDIDDatasetReplicas = Template.bind({});
 PageDIDDatasetReplicas.args = {
-	comdom: mockUseComDOM(Array.from({ length: 100 }, (_, i) => createDIDDatasetReplicas()))
+	comdom: mockUseComDOM(Array.from({ length: 100 }, (_, i) => fixtureDIDDatasetReplicasViewModel()))
 };
diff --git a/src/component-library/Pages/DID/PageDIDDatasetReplicas.tsx b/src/component-library/Pages/DID/PageDIDDatasetReplicas.tsx
index 04412af14..58d692b57 100644
--- a/src/component-library/Pages/DID/PageDIDDatasetReplicas.tsx
+++ b/src/component-library/Pages/DID/PageDIDDatasetReplicas.tsx
@@ -1,4 +1,3 @@
-import { DIDDatasetReplicas } from "@/lib/infrastructure/data/view-model/page-did";
 import { twMerge } from "tailwind-merge";
 import { createColumnHelper } from "@tanstack/react-table"
 import { useEffect, useState } from "react"
@@ -12,13 +11,14 @@ import { StreamedTable } from "../../StreamedTables/StreamedTable";
 import { TableFilterString } from "../../StreamedTables/TableFilterString";
 import { TableSortUpDown } from "../../StreamedTables/TableSortUpDown";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { DIDDatasetReplicasViewModel } from "@/lib/infrastructure/data/view-model/did";
 
 export const PageDIDDatasetReplicas = (
     props: {
-        comdom: UseComDOM<DIDDatasetReplicas>;
+        comdom: UseComDOM<DIDDatasetReplicasViewModel>;
     }
 ) => {
-    const columnHelper = createColumnHelper<DIDDatasetReplicas>()
+    const columnHelper = createColumnHelper<DIDDatasetReplicasViewModel>()
     const tablecolumns: any[] = [
         columnHelper.accessor("rse", {
             id: "rse",
@@ -203,7 +203,7 @@ export const PageDIDDatasetReplicas = (
 
 
     return (
-        <StreamedTable<DIDDatasetReplicas>
+        <StreamedTable<DIDDatasetReplicasViewModel>
             tablecomdom={props.comdom}
             tablecolumns={tablecolumns}
             tablestyling={{
@@ -218,7 +218,7 @@ export const PageDIDDatasetReplicas = (
                 } 
             }}
             tableselecting={{
-                handleChange: (data: DIDDatasetReplicas[]) => {},
+                handleChange: (data: DIDDatasetReplicasViewModel[]) => {},
                 enableRowSelection: !isLg(),
                 breakOut: {
                     breakoutVisibility: !isLg(),
diff --git a/src/component-library/Pages/DID/PageDIDFilereplicas.stories.tsx b/src/component-library/Pages/DID/PageDIDFilereplicas.stories.tsx
index 702b3bcf6..374339af1 100644
--- a/src/component-library/Pages/DID/PageDIDFilereplicas.stories.tsx
+++ b/src/component-library/Pages/DID/PageDIDFilereplicas.stories.tsx
@@ -1,7 +1,7 @@
 import { StoryFn, Meta } from '@storybook/react';
 import { PageDIDFilereplicas as PDF } from "./PageDIDFilereplicas"
 import { ReplicaState } from '@/lib/core/entity/rucio';
-import { createFileReplicaState, mockUseComDOM } from 'test/fixtures/table-fixtures';
+import { fixtureFilereplicaStateViewModel, mockUseComDOM } from 'test/fixtures/table-fixtures';
 
 export default {
     title: "Components/Pages/DID",
@@ -12,5 +12,5 @@ const Template: StoryFn<typeof PDF> = (args) => <PDF {...args} />;
 
 export const PageDIDFilereplicas = Template.bind({});
 PageDIDFilereplicas.args = {
-    comdom: mockUseComDOM(Array.from({length: 100}, (_, i) => createFileReplicaState()))
+    comdom: mockUseComDOM(Array.from({length: 100}, (_, i) => fixtureFilereplicaStateViewModel()))
 }
\ No newline at end of file
diff --git a/src/component-library/Pages/DID/PageDIDFilereplicas.tsx b/src/component-library/Pages/DID/PageDIDFilereplicas.tsx
index 44e81535c..0271472b2 100644
--- a/src/component-library/Pages/DID/PageDIDFilereplicas.tsx
+++ b/src/component-library/Pages/DID/PageDIDFilereplicas.tsx
@@ -9,19 +9,19 @@ import { HiDotsHorizontal } from "react-icons/hi"
 // Viewmodels etc
 import { ReplicaState } from "@/lib/core/entity/rucio";
 import { ReplicaStateTag } from "../../Tags/ReplicaStateTag";
-import { FilereplicaState } from "@/lib/infrastructure/data/view-model/page-did";
 import { StreamedTable } from "../../StreamedTables/StreamedTable";
 import { TableFilterString } from "../../StreamedTables/TableFilterString";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
 import { TableInternalLink } from "../../StreamedTables/TableInternalLink";
+import { FilereplicaStateViewModel } from "@/lib/infrastructure/data/view-model/did";
 
 
 export const PageDIDFilereplicas = (
     props: {
-        comdom: UseComDOM<FilereplicaState>,
+        comdom: UseComDOM<FilereplicaStateViewModel>,
     }
 ) => {
-    const columnHelper = createColumnHelper<FilereplicaState>()
+    const columnHelper = createColumnHelper<FilereplicaStateViewModel>()
     const tablecolumns: any[] = [
         columnHelper.accessor("rse", {
             id: "rse",
@@ -68,7 +68,7 @@ export const PageDIDFilereplicas = (
         })
     ]
     return (
-        <StreamedTable<FilereplicaState>
+        <StreamedTable<FilereplicaStateViewModel>
             tablecomdom={props.comdom}
             tablecolumns={tablecolumns}
             tablestyling={{}}
diff --git a/src/component-library/Pages/DID/PageDIDFilereplicasD.stories.tsx b/src/component-library/Pages/DID/PageDIDFilereplicasD.stories.tsx
index d999984a2..a18f60355 100644
--- a/src/component-library/Pages/DID/PageDIDFilereplicasD.stories.tsx
+++ b/src/component-library/Pages/DID/PageDIDFilereplicasD.stories.tsx
@@ -1,7 +1,6 @@
 import { StoryFn, Meta } from '@storybook/react';
 import { PageDIDFilereplicasD as PDFD } from "./PageDIDFilereplicasD"
-import { ReplicaState } from '@/lib/core/entity/rucio';
-import { createFileReplicaState, createFileReplicaStateD, mockUseComDOM } from 'test/fixtures/table-fixtures';
+import { fixtureFilereplicaStateViewModel, fixtureFilereplicaStateDViewModel, mockUseComDOM } from 'test/fixtures/table-fixtures';
 
 export default {
     title: "Components/Pages/DID",
@@ -12,7 +11,7 @@ const Template: StoryFn<typeof PDFD> = (args) => <PDFD {...args} />;
 
 export const PageDIDFilereplicasD = Template.bind({});
 PageDIDFilereplicasD.args = {
-    replicaComDOM: mockUseComDOM(Array.from({length: 100}, (_, i) => createFileReplicaState())),
-    datasetComDOM: mockUseComDOM(Array.from({length: 100}, (_, i) => createFileReplicaStateD())),
+    replicaComDOM: mockUseComDOM(Array.from({length: 100}, (_, i) => fixtureFilereplicaStateViewModel())),
+    datasetComDOM: mockUseComDOM(Array.from({length: 100}, (_, i) => fixtureFilereplicaStateDViewModel())),
     onChangeDatasetSelection: (dataset: string) => console.log("onChangeDatasetSelection", dataset),
 }
\ No newline at end of file
diff --git a/src/component-library/Pages/DID/PageDIDFilereplicasD.tsx b/src/component-library/Pages/DID/PageDIDFilereplicasD.tsx
index d65727b96..a7bf8df17 100644
--- a/src/component-library/Pages/DID/PageDIDFilereplicasD.tsx
+++ b/src/component-library/Pages/DID/PageDIDFilereplicasD.tsx
@@ -7,23 +7,22 @@ import { createColumnHelper } from "@tanstack/react-table"
 import { twMerge } from "tailwind-merge"
 
 // Viewmodels etc
-import { FilereplicaStateD } from "@/lib/infrastructure/data/view-model/page-did";
-import { FilereplicaState } from "@/lib/infrastructure/data/view-model/page-did";
 import { StreamedTable } from "../../StreamedTables/StreamedTable";
 import { TableFilterString } from "../../StreamedTables/TableFilterString";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { FilereplicaStateDViewModel, FilereplicaStateViewModel } from "@/lib/infrastructure/data/view-model/did";
 
 
 
 export const PageDIDFilereplicasD = (
     props: {
-        datasetComDOM: UseComDOM<FilereplicaStateD>,
-        replicaComDOM: UseComDOM<FilereplicaState>,
+        datasetComDOM: UseComDOM<FilereplicaStateDViewModel>,
+        replicaComDOM: UseComDOM<FilereplicaStateViewModel>,
         onChangeDatasetSelection: (selected: string) => void,
     }
 ) => {
     const { datasetComDOM, replicaComDOM, onChangeDatasetSelection } = props
-    const columnHelper = createColumnHelper<FilereplicaStateD>()
+    const columnHelper = createColumnHelper<FilereplicaStateDViewModel>()
     const tablecolumns: any[] = [
         columnHelper.accessor(row => `${row.scope}:${row.name}`, {
             id: "did",
@@ -56,7 +55,7 @@ export const PageDIDFilereplicasD = (
                     tablecolumns={tablecolumns}
                     tablestyling={{}}
                     tableselecting={{
-                        handleChange: (data: FilereplicaStateD[]) => { console.info(data) },
+                        handleChange: (data: FilereplicaStateDViewModel[]) => { console.info(data) },
                         enableRowSelection: true,
                         enableMultiRowSelection: false
                     }}
diff --git a/src/component-library/Pages/DID/PageDIDMetadata.stories.tsx b/src/component-library/Pages/DID/PageDIDMetadata.stories.tsx
index 8bcc4435b..7097c5185 100644
--- a/src/component-library/Pages/DID/PageDIDMetadata.stories.tsx
+++ b/src/component-library/Pages/DID/PageDIDMetadata.stories.tsx
@@ -1,5 +1,5 @@
 import { StoryFn, Meta } from '@storybook/react';
-import { mockUseComDOM } from 'test/fixtures/table-fixtures';
+import { fixtureDIDKeyValuePairsViewModel, mockUseComDOM } from 'test/fixtures/table-fixtures';
 import { PageDIDMetadata as P } from "./PageDIDMetadata"
 
 export default {
@@ -11,13 +11,5 @@ const Template: StoryFn<typeof P> = (args) => <P {...args} />;
 
 export const PageDIDMetadata = Template.bind({});
 PageDIDMetadata.args = {
-    comdom: mockUseComDOM([
-        { key: "bernd", value: "das brot" },
-        { key: "kika", value: "der sender" },
-        { key: "kikaninchen", value: "das tier" },
-        { key: "my birthday", value: (new Date(2021, 3)).toISOString() },
-        { key: "am_i_anton", value: false },
-        { key: "R1-tastefactor", value: 3.142 },
-        { key: "hello", value: null },
-    ])
+    comdom: mockUseComDOM(Array.from({length: 100}, (_, i) => fixtureDIDKeyValuePairsViewModel()))
 }
\ No newline at end of file
diff --git a/src/component-library/Pages/DID/PageDIDMetadata.tsx b/src/component-library/Pages/DID/PageDIDMetadata.tsx
index 0ac48aad3..9006fc666 100644
--- a/src/component-library/Pages/DID/PageDIDMetadata.tsx
+++ b/src/component-library/Pages/DID/PageDIDMetadata.tsx
@@ -14,17 +14,17 @@ import { twMerge } from "tailwind-merge"
 
 // Viewmodels etc
 import { DIDAvailability } from "@/lib/core/entity/rucio"
-import { DIDKeyValuePairs } from "@/lib/infrastructure/data/view-model/page-did";
 import { TableFilterString } from "../../StreamedTables/TableFilterString";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { DIDKeyValuePairsViewModel } from "@/lib/infrastructure/data/view-model/did";
 
 export const PageDIDMetadata = (
     props: {
-        comdom: UseComDOM<DIDKeyValuePairs> // remember that this is ONLY the custom metadata
+        comdom: UseComDOM<DIDKeyValuePairsViewModel> // remember that this is ONLY the custom metadata
     }
 ) => {
 
-    const columnHelper = createColumnHelper<DIDKeyValuePairs>()
+    const columnHelper = createColumnHelper<DIDKeyValuePairsViewModel>()
     const tablecolumns: any[] = [
         columnHelper.accessor("key", {
             id: "key",
@@ -74,7 +74,7 @@ export const PageDIDMetadata = (
     ]
 
     return (
-        <StreamedTable<DIDKeyValuePairs>
+        <StreamedTable<DIDKeyValuePairsViewModel>
             tablecomdom={props.comdom}
             tablecolumns={tablecolumns}
             tablestyling={{}}
diff --git a/src/component-library/Pages/DID/PageDIDRules.stories.tsx b/src/component-library/Pages/DID/PageDIDRules.stories.tsx
index b97d847bf..a7de37cda 100644
--- a/src/component-library/Pages/DID/PageDIDRules.stories.tsx
+++ b/src/component-library/Pages/DID/PageDIDRules.stories.tsx
@@ -1,6 +1,6 @@
 import { StoryFn, Meta } from "@storybook/react";
 import { PageDIDRules as P } from "./PageDIDRules";
-import { createDIDRules, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureDIDRulesViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 
 export default {
     title: 'Components/Pages/DID',
@@ -11,5 +11,5 @@ const Template: StoryFn<typeof P> = (args) => <P {...args} />;
 
 export const PageDIDRules = Template.bind({});
 PageDIDRules.args = {
-    comdom: mockUseComDOM(Array.from({length: 100}, (_, i) => createDIDRules())),
+    comdom: mockUseComDOM(Array.from({length: 100}, (_, i) => fixtureDIDRulesViewModel())),
 };
diff --git a/src/component-library/Pages/DID/PageDIDRules.tsx b/src/component-library/Pages/DID/PageDIDRules.tsx
index 61c8bb639..b9a6b38ce 100644
--- a/src/component-library/Pages/DID/PageDIDRules.tsx
+++ b/src/component-library/Pages/DID/PageDIDRules.tsx
@@ -2,7 +2,6 @@
 import { H3 } from "../../Text/Headings/H3";
 import { HiDotsHorizontal } from "react-icons/hi"
 import { TableData } from "@/lib/infrastructure/data/view-model/streamedtables";
-import { DIDRules } from "@/lib/infrastructure/data/view-model/page-did";
 import { createColumnHelper} from "@tanstack/react-table"
 import { useEffect, useState } from "react";
 import { twMerge } from "tailwind-merge";
@@ -14,13 +13,14 @@ import { TableFilterDiscrete } from "../../StreamedTables/TableFilterDiscrete";
 import { TableFilterString } from "../../StreamedTables/TableFilterString";
 import { TableSortUpDown } from "../../StreamedTables/TableSortUpDown.stories";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { DIDRulesViewModel } from "@/lib/infrastructure/data/view-model/did";
 
 export const PageDIDRules = (
     props: {
-        comdom: UseComDOM<DIDRules>
+        comdom: UseComDOM<DIDRulesViewModel>
     }
 ) => {
-    const columnHelper = createColumnHelper<DIDRules>()
+    const columnHelper = createColumnHelper<DIDRulesViewModel>()
     const tablecolumns: any[] = [
         columnHelper.accessor("id", {
             id: "id",
@@ -165,7 +165,7 @@ export const PageDIDRules = (
 
 
     return (
-        <StreamedTable<DIDRules>
+        <StreamedTable<DIDRulesViewModel>
             tablecomdom={props.comdom}
             tablecolumns={tablecolumns}
             tablestyling={{
diff --git a/src/component-library/Pages/RSE/ListRSE.stories.tsx b/src/component-library/Pages/RSE/ListRSE.stories.tsx
index f5c7de789..dd12ad7b5 100644
--- a/src/component-library/Pages/RSE/ListRSE.stories.tsx
+++ b/src/component-library/Pages/RSE/ListRSE.stories.tsx
@@ -1,5 +1,5 @@
 import { StoryFn, Meta } from "@storybook/react";
-import { mockUseComDOM, createRSE } from "test/fixtures/table-fixtures";
+import { mockUseComDOM, fixtureRSEViewModel } from "test/fixtures/table-fixtures";
 import { ListRSE as L } from "./ListRSE";
 
 export default {
@@ -11,5 +11,5 @@ const Template: StoryFn<typeof L> = (args) => <L {...args} />;
 
 export const ListRSE = Template.bind({});
 ListRSE.args = {
-    comdom: mockUseComDOM(Array.from({ length: 100 }, () => createRSE()))
+    comdom: mockUseComDOM(Array.from({ length: 100 }, () => fixtureRSEViewModel()))
 };
diff --git a/src/component-library/Pages/RSE/ListRSE.tsx b/src/component-library/Pages/RSE/ListRSE.tsx
index 6ab96517c..25401a4d3 100644
--- a/src/component-library/Pages/RSE/ListRSE.tsx
+++ b/src/component-library/Pages/RSE/ListRSE.tsx
@@ -14,13 +14,14 @@ import { TableInternalLink } from "../../StreamedTables/TableInternalLink";
 import useReponsiveHook from "../../Helpers/ResponsiveHook";
 import { Body } from "../Helpers/Body";
 import { Heading } from "../Helpers/Heading";
+import { RSEViewModel } from "@/lib/infrastructure/data/view-model/rse";
 
 export const ListRSE = (
     props: {
-        comdom: UseComDOM<RSE>
+        comdom: UseComDOM<RSEViewModel>
     }
 ) => {
-    const columnHelper = createColumnHelper<RSE>()
+    const columnHelper = createColumnHelper<RSEViewModel>()
     const tablecolumns = [
         columnHelper.accessor("name", {
             id: "name",
@@ -122,7 +123,7 @@ export const ListRSE = (
                 title="List RSEs"
             />
             <Body>
-                <StreamedTable<RSE>
+                <StreamedTable<RSEViewModel>
                     tablecomdom={props.comdom}
                     tablecolumns={tablecolumns}
                     tablestyling={{
diff --git a/src/component-library/Pages/RSE/PageRSE.stories.tsx b/src/component-library/Pages/RSE/PageRSE.stories.tsx
index 6b1bc757a..8e9278401 100644
--- a/src/component-library/Pages/RSE/PageRSE.stories.tsx
+++ b/src/component-library/Pages/RSE/PageRSE.stories.tsx
@@ -1,6 +1,6 @@
 import { RSEBlockState } from "@/lib/core/entity/rucio";
 import { StoryFn, Meta } from "@storybook/react";
-import { createRSE, createRSEProtocol, createRSEAttribute, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureRSEViewModel, fixtureRSEProtocolViewModel, fixtureRSEAttributeViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { PageRSE as P } from "./PageRSE";
 
 export default {
@@ -12,9 +12,9 @@ const Template: StoryFn<typeof P> = (args) => <P {...args} />;
 
 export const PageRSE = Template.bind({});
 PageRSE.args = {
-    rse: createRSE(),
+    rse: fixtureRSEViewModel(),
     rseblockstate: 7 as RSEBlockState, // 7 = all blocked
-    protocolscomdom: mockUseComDOM(Array.from({length: 20}, (_, i) => createRSEProtocol())),
-    attributescomdom: mockUseComDOM(Array.from({ length: 20 }, (_, i) => createRSEAttribute())),
+    protocolscomdom: mockUseComDOM(Array.from({length: 20}, (_, i) => fixtureRSEProtocolViewModel())),
+    attributescomdom: mockUseComDOM(Array.from({ length: 20 }, (_, i) => fixtureRSEAttributeViewModel())),
     fromrselist: true,
 };
diff --git a/src/component-library/Pages/RSE/PageRSE.tsx b/src/component-library/Pages/RSE/PageRSE.tsx
index 78594596f..764dfaec0 100644
--- a/src/component-library/Pages/RSE/PageRSE.tsx
+++ b/src/component-library/Pages/RSE/PageRSE.tsx
@@ -7,7 +7,7 @@ import { BoolTag } from "../../Tags/BoolTag";
 import { RSETypeTag } from "../../Tags/RSETypeTag";
 import { RSETag } from "../../Tags/RSETag";
 import { HiArrowCircleLeft } from "react-icons/hi";
-import { RSEAttribute, RSEProtocol } from "@/lib/infrastructure/data/view-model/rse";
+import { RSEAttribute, RSEAttributeViewModel, RSEProtocol, RSEProtocolViewModel, RSEViewModel } from "@/lib/infrastructure/data/view-model/rse";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
 import { PageRSEProtocols } from "./PageRSEProtocols";
 import { PageRSEAttributes } from "./PageRSEAttributes";
@@ -16,10 +16,10 @@ import { Body } from "../Helpers/Body";
 import { Heading } from "../Helpers/Heading";
 
 type PageRSEProps = {
-    rse: RSE
+    rse: RSEViewModel
     rseblockstate: RSEBlockState
-    protocolscomdom: UseComDOM<RSEProtocol>
-    attributescomdom: UseComDOM<RSEAttribute>
+    protocolscomdom: UseComDOM<RSEProtocolViewModel>
+    attributescomdom: UseComDOM<RSEAttributeViewModel>
     fromrselist?: boolean
 }
 
diff --git a/src/component-library/Pages/RSE/PageRSEAttributes.stories.tsx b/src/component-library/Pages/RSE/PageRSEAttributes.stories.tsx
index 18fe8337f..0d5b29f5e 100644
--- a/src/component-library/Pages/RSE/PageRSEAttributes.stories.tsx
+++ b/src/component-library/Pages/RSE/PageRSEAttributes.stories.tsx
@@ -1,5 +1,5 @@
 import { StoryFn, Meta } from "@storybook/react";
-import { createRSEAttribute, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureRSEAttributeViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { PageRSEAttributes as P } from "./PageRSEAttributes";
 
 export default {
@@ -11,5 +11,5 @@ const Template: StoryFn<typeof P> = (args) => <P {...args} />;
 
 export const PageRSEAttributes = Template.bind({});
 PageRSEAttributes.args = {
-    comdom: mockUseComDOM(Array.from({ length: 20 }, (_, i) => createRSEAttribute()))
+    comdom: mockUseComDOM(Array.from({ length: 20 }, (_, i) => fixtureRSEAttributeViewModel()))
 };
diff --git a/src/component-library/Pages/RSE/PageRSEAttributes.tsx b/src/component-library/Pages/RSE/PageRSEAttributes.tsx
index 9b8722ebd..07df4e28f 100644
--- a/src/component-library/Pages/RSE/PageRSEAttributes.tsx
+++ b/src/component-library/Pages/RSE/PageRSEAttributes.tsx
@@ -1,6 +1,5 @@
 import { twMerge } from "tailwind-merge";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
-import { RSEAttribute } from "@/lib/infrastructure/data/view-model/rse";
 import { createColumnHelper } from "@tanstack/react-table";
 import { TableFilterString } from "../../StreamedTables/TableFilterString";
 import { P } from "../../Text/Content/P";
@@ -8,13 +7,14 @@ import { H3 } from "../../Text/Headings/H3";
 import { StreamedTable } from "../../StreamedTables/StreamedTable";
 import { BoolTag } from "../../Tags/BoolTag";
 import { NullTag } from "../../Tags/NullTag";
+import { RSEAttributeViewModel } from "@/lib/infrastructure/data/view-model/rse";
 
 export const PageRSEAttributes = (
     props: {
-        comdom: UseComDOM<RSEAttribute>
+        comdom: UseComDOM<RSEAttributeViewModel>
     }
 ) => {
-    const columnHelper = createColumnHelper<RSEAttribute>()
+    const columnHelper = createColumnHelper<RSEAttributeViewModel>()
     const tablecolumns: any[] = [
         columnHelper.accessor("key", {
             id: "key",
@@ -37,7 +37,7 @@ export const PageRSEAttributes = (
         }),
     ]
     return (
-        <StreamedTable<RSEAttribute>
+        <StreamedTable<RSEAttributeViewModel>
             tablecomdom={props.comdom}
             tablecolumns={tablecolumns}
             tablestyling={{}}
diff --git a/src/component-library/Pages/RSE/PageRSEProtocols.stories.tsx b/src/component-library/Pages/RSE/PageRSEProtocols.stories.tsx
index e3e0bf643..2b2535bcb 100644
--- a/src/component-library/Pages/RSE/PageRSEProtocols.stories.tsx
+++ b/src/component-library/Pages/RSE/PageRSEProtocols.stories.tsx
@@ -1,5 +1,5 @@
 import { StoryFn, Meta } from "@storybook/react";
-import { createRSEProtocol, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureRSEProtocolViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { PageRSEProtocols as P } from "./PageRSEProtocols";
 
 export default {
@@ -11,5 +11,5 @@ const Template: StoryFn<typeof P> = (args) => <P {...args} />;
 
 export const PageRSEProtocols = Template.bind({});
 PageRSEProtocols.args = {
-    comdom: mockUseComDOM(Array.from({length: 20}, (_, i) => createRSEProtocol()))
+    comdom: mockUseComDOM(Array.from({length: 20}, (_, i) => fixtureRSEProtocolViewModel()))
 };
diff --git a/src/component-library/Pages/RSE/PageRSEProtocols.tsx b/src/component-library/Pages/RSE/PageRSEProtocols.tsx
index cc7136147..b847d7810 100644
--- a/src/component-library/Pages/RSE/PageRSEProtocols.tsx
+++ b/src/component-library/Pages/RSE/PageRSEProtocols.tsx
@@ -1,4 +1,3 @@
-import { RSEProtocol } from "@/lib/infrastructure/data/view-model/rse";
 import { createColumnHelper } from "@tanstack/react-table";
 import { P } from "../../Text/Content/P";
 import { twMerge } from "tailwind-merge";
@@ -7,16 +6,17 @@ import { StreamedTable } from "../../StreamedTables/StreamedTable.stories";
 import { TableSortUpDown } from "../../StreamedTables/TableSortUpDown";
 import { TableFilterString } from "../../StreamedTables/TableFilterString";
 import { H3 } from "../../Text/Headings/H3";
+import { RSEProtocolViewModel } from "@/lib/infrastructure/data/view-model/rse";
 
 export const PageRSEProtocols = (
     props: {
-        comdom: UseComDOM<RSEProtocol>
+        comdom: UseComDOM<RSEProtocolViewModel>
     }
 ) => {
     const shortstyle = { style: "w-20" }
     const shortstyleblue = { style: "w-20 bg-blue-100"}
     const shortstylepink = { style: "w-20 bg-pink-100"}
-    const columnHelper = createColumnHelper<RSEProtocol>()
+    const columnHelper = createColumnHelper<RSEProtocolViewModel>()
     const tablecolumns: any[] = [
         columnHelper.accessor("scheme", {
             id: "scheme",
diff --git a/src/component-library/Pages/Rule/CreateRule.stories.tsx b/src/component-library/Pages/Rule/CreateRule.stories.tsx
index 0c61a56e2..af5c2c021 100644
--- a/src/component-library/Pages/Rule/CreateRule.stories.tsx
+++ b/src/component-library/Pages/Rule/CreateRule.stories.tsx
@@ -1,5 +1,5 @@
 import { StoryFn, Meta } from '@storybook/react'
-import { createRandomDIDLong, createRSEAccountUsageLimit, mockUseComDOM } from 'test/fixtures/table-fixtures'
+import { fixtureDIDLongViewModel, fixtureRSEAccountUsageLimitViewModel, mockUseComDOM } from 'test/fixtures/table-fixtures'
 
 import { CreateRule as CR } from './CreateRule'
 import {
@@ -21,7 +21,7 @@ CreateRule.args = {
             success: true,
         })
     },
-    didListComDOM: mockUseComDOM(Array.from({ length: 100 }, () => createRandomDIDLong())),
+    didListComDOM: mockUseComDOM(Array.from({ length: 100 }, () => fixtureDIDLongViewModel())),
     didValidation: (query: TypedDIDValidationQuery) => {
         // if the DID contains the string "error", it will be added to the error list
         var localErrorDIDs: TypedDIDValidationResponse = { ErrorList: [] }
@@ -38,5 +38,5 @@ CreateRule.args = {
             return Promise.reject(localErrorDIDs)
         }
     },
-    rseListComDOM: mockUseComDOM(Array.from({ length: 100 }, () => createRSEAccountUsageLimit())),
+    rseListComDOM: mockUseComDOM(Array.from({ length: 100 }, () => fixtureRSEAccountUsageLimitViewModel())),
 }
diff --git a/src/component-library/Pages/Rule/CreateRule.tsx b/src/component-library/Pages/Rule/CreateRule.tsx
index 0b7817592..a1a3cf58d 100644
--- a/src/component-library/Pages/Rule/CreateRule.tsx
+++ b/src/component-library/Pages/Rule/CreateRule.tsx
@@ -23,25 +23,27 @@ import { Body } from '../Helpers/Body';
 /* =================================================
 *  Importing Types and Interfaces
 *  ================================================= */
-import { DIDLong, DIDType, RSEAccountUsageLimit } from '@/lib/core/entity/rucio';
 import {
     CreateRuleQuery, CreateRuleResponse, DIDName, TypedDIDValidationQuery,
     TypedDIDValidationResponse,
 
 } from '@/lib/infrastructure/data/view-model/create-rule.d';
+import { DIDType } from '@/lib/core/entity/rucio';
 import { twMerge } from 'tailwind-merge';
 import { SamplingTag } from '../../Tags/SamplingTag';
 import { CreateRuleDIDTable } from './CreateRuleDIDTable';
 import { didToScopename } from '../../StreamedTables/helpers';
 import { CreateRuleRSETable } from './CreateRuleRSETable';
+import { RSEAccountUsageLimitViewModel } from '@/lib/infrastructure/data/view-model/rse';
+import { DIDLongViewModel } from '@/lib/infrastructure/data/view-model/did';
 
 export interface CreateRulePageProps {
     // Page 0.0 - DID Search`
-    didListComDOM: UseComDOM<DIDLong>,
+    didListComDOM: UseComDOM<DIDLongViewModel>,
     // Page 0.1 - DID Validation
     didValidation: (didValidationQuery: TypedDIDValidationQuery) => Promise<TypedDIDValidationResponse>,
     // Page 1 - RSE Selection
-    rseListComDOM: UseComDOM<RSEAccountUsageLimit>,
+    rseListComDOM: UseComDOM<RSEAccountUsageLimitViewModel>,
     // Page 3 - Sendoff
     onSubmit: (createRuleQuery: CreateRuleQuery) => Promise<CreateRuleResponse>
 }
@@ -55,7 +57,7 @@ interface Page0State {
     selectDIDMethod: number
     // selection by search
     selectDIDDataPattern: string
-    searchDIDSelection: Array<DIDLong>
+    searchDIDSelection: Array<DIDLongViewModel>
 
     // Subpage 1: List of DIDs
     // selection via typing
@@ -66,7 +68,7 @@ interface Page0State {
 interface Page1State {
     page1progressBlocked: boolean
     RSEExpression: string
-    RSESelection: Array<RSEAccountUsageLimit>
+    RSESelection: Array<RSEAccountUsageLimitViewModel>
     askForApproval: boolean
 }
 
@@ -281,7 +283,7 @@ export const CreateRule = (
                             </div>
                             <CreateRuleDIDTable
                                 comdom={props.didListComDOM}
-                                handleChange={(data: DIDLong[]) => { setPage0State({ ...Page0State, searchDIDSelection: data }) }}
+                                handleChange={(data: DIDLongViewModel[]) => { setPage0State({ ...Page0State, searchDIDSelection: data }) }}
                             />
                         </div>
                     </Collapsible>
@@ -333,7 +335,7 @@ export const CreateRule = (
                         </div>
                         <CreateRuleRSETable
                             comdom={props.rseListComDOM}
-                            handleChange={(data: RSEAccountUsageLimit[]) => { setPage1State({ ...Page1State, RSESelection: data }) }}
+                            handleChange={(data: RSEAccountUsageLimitViewModel[]) => { setPage1State({ ...Page1State, RSESelection: data }) }}
                             askApproval={Page1State.askForApproval}
                         />
                         <div>
diff --git a/src/component-library/Pages/Rule/CreateRuleDIDTable.stories.tsx b/src/component-library/Pages/Rule/CreateRuleDIDTable.stories.tsx
index 29d63f690..f1f3a7733 100644
--- a/src/component-library/Pages/Rule/CreateRuleDIDTable.stories.tsx
+++ b/src/component-library/Pages/Rule/CreateRuleDIDTable.stories.tsx
@@ -1,7 +1,7 @@
 import { StoryFn, Meta } from "@storybook/react";
 import { CreateRuleDIDTable as C } from "./CreateRuleDIDTable";
 import { DIDLong } from "@/lib/core/entity/rucio";
-import { createRandomDIDLong, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureDIDLongViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 
 export default {
     title: 'Components/Pages/Rule',
@@ -12,6 +12,6 @@ const Template: StoryFn<typeof C> = (args) => <C {...args} />;
 
 export const CreateRuleDIDTable = Template.bind({});
 CreateRuleDIDTable.args = {
-    comdom: mockUseComDOM(Array.from({length: 100}, () => createRandomDIDLong())),
+    comdom: mockUseComDOM(Array.from({length: 100}, () => fixtureDIDLongViewModel())),
     handleChange: (data: DIDLong[]) => {console.info(data)},
 };
diff --git a/src/component-library/Pages/Rule/CreateRuleDIDTable.tsx b/src/component-library/Pages/Rule/CreateRuleDIDTable.tsx
index d9a1d67c6..733598072 100644
--- a/src/component-library/Pages/Rule/CreateRuleDIDTable.tsx
+++ b/src/component-library/Pages/Rule/CreateRuleDIDTable.tsx
@@ -1,4 +1,4 @@
-import { DIDLong, DIDType } from "@/lib/core/entity/rucio";
+import { DIDType } from "@/lib/core/entity/rucio";
 import { twMerge } from "tailwind-merge";
 import { createColumnHelper } from "@tanstack/react-table";
 import { DIDTypeTag } from "../../Tags/DIDTypeTag";
@@ -10,14 +10,15 @@ import { TableFilterDiscrete } from "../../StreamedTables/TableFilterDiscrete";
 import { HiDotsHorizontal } from "react-icons/hi";
 import { TableSortUpDown } from "../../StreamedTables/TableSortUpDown";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { DIDLongViewModel } from "@/lib/infrastructure/data/view-model/did";
 
 export const CreateRuleDIDTable = (
     props: {
-        comdom: UseComDOM<DIDLong>,
-        handleChange: (data: DIDLong[]) => void,
+        comdom: UseComDOM<DIDLongViewModel>,
+        handleChange: (data: DIDLongViewModel[]) => void,
     }
 ) => {
-    const columnHelper = createColumnHelper<DIDLong>()
+    const columnHelper = createColumnHelper<DIDLongViewModel>()
     const tablecolumns: any[] = [
         columnHelper.display({
             id: "selection",
diff --git a/src/component-library/Pages/Rule/CreateRuleRSETable.stories.tsx b/src/component-library/Pages/Rule/CreateRuleRSETable.stories.tsx
index 2cd4f1e74..fd1b79512 100644
--- a/src/component-library/Pages/Rule/CreateRuleRSETable.stories.tsx
+++ b/src/component-library/Pages/Rule/CreateRuleRSETable.stories.tsx
@@ -1,6 +1,6 @@
 import { RSEAccountUsageLimit } from "@/lib/core/entity/rucio";
 import { StoryFn, Meta } from "@storybook/react";
-import { createRSEAccountUsageLimit, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureRSEAccountUsageLimitViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { CreateRuleRSETable as C } from "./CreateRuleRSETable";
 
 export default {
@@ -12,6 +12,6 @@ const Template: StoryFn<typeof C> = (args) => <C {...args} />;
 
 export const CreateRuleRSETable = Template.bind({});
 CreateRuleRSETable.args = {
-    comdom: mockUseComDOM(Array.from({length: 100}, () => createRSEAccountUsageLimit())),
+    comdom: mockUseComDOM(Array.from({length: 100}, () => fixtureRSEAccountUsageLimitViewModel())),
     handleChange: (data: RSEAccountUsageLimit[]) => {console.info(data)},
 };
diff --git a/src/component-library/Pages/Rule/CreateRuleRSETable.tsx b/src/component-library/Pages/Rule/CreateRuleRSETable.tsx
index 0e4a4fc46..e3c34d229 100644
--- a/src/component-library/Pages/Rule/CreateRuleRSETable.tsx
+++ b/src/component-library/Pages/Rule/CreateRuleRSETable.tsx
@@ -1,4 +1,3 @@
-import { RSEAccountUsageLimit } from "@/lib/core/entity/rucio";
 import { twMerge } from "tailwind-merge";
 import { StreamedTable } from "../../StreamedTables/StreamedTable";
 import { createColumnHelper, Row } from "@tanstack/react-table";
@@ -9,16 +8,17 @@ import { TableSortUpDown } from "../../StreamedTables/TableSortUpDown";
 import { useState, useEffect } from "react";
 import { TableFilterString } from "../../StreamedTables/TableFilterString";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
+import { RSEAccountUsageLimitViewModel } from "@/lib/infrastructure/data/view-model/rse";
 
 export const CreateRuleRSETable = (
     props: {
-        comdom: UseComDOM<RSEAccountUsageLimit>,
-        handleChange: (data: RSEAccountUsageLimit[]) => void,
+        comdom: UseComDOM<RSEAccountUsageLimitViewModel>,
+        handleChange: (data: RSEAccountUsageLimitViewModel[]) => void,
         askApproval?: boolean
     }
 ) => {
-    const columnHelper = createColumnHelper<RSEAccountUsageLimit>()
-    const isNoQuotaLeftFunction = (row: Row<RSEAccountUsageLimit>) => {
+    const columnHelper = createColumnHelper<RSEAccountUsageLimitViewModel>()
+    const isNoQuotaLeftFunction = (row: Row<RSEAccountUsageLimitViewModel>) => {
         let noQuota = (row.original.quota_bytes && row.original.quota_bytes < row.original.used_bytes)
         return props.askApproval ? false : noQuota
     }
diff --git a/src/component-library/Pages/Rule/ListRule.stories.tsx b/src/component-library/Pages/Rule/ListRule.stories.tsx
index adad4b45a..4c9ec5a1f 100644
--- a/src/component-library/Pages/Rule/ListRule.stories.tsx
+++ b/src/component-library/Pages/Rule/ListRule.stories.tsx
@@ -1,6 +1,6 @@
 import { StoryFn, Meta } from "@storybook/react";
 import { ListRule as L } from "./ListRule";
-import { mockUseComDOM, createRule } from "test/fixtures/table-fixtures";
+import { mockUseComDOM, fixtureRuleViewModel } from "test/fixtures/table-fixtures";
 
 export default {
     title: 'Components/Pages/Rule',
@@ -11,5 +11,5 @@ const Template: StoryFn<typeof L> = (args) => <L {...args} />;
 
 export const ListRule = Template.bind({});
 ListRule.args = {
-    comdom: mockUseComDOM(Array.from({length: 100}, () => createRule()))
+    comdom: mockUseComDOM(Array.from({length: 100}, () => fixtureRuleViewModel()))
 };
diff --git a/src/component-library/Pages/Rule/ListRule.tsx b/src/component-library/Pages/Rule/ListRule.tsx
index ee4ff6f6a..440f7d8e6 100644
--- a/src/component-library/Pages/Rule/ListRule.tsx
+++ b/src/component-library/Pages/Rule/ListRule.tsx
@@ -24,6 +24,7 @@ import { DateInput } from "../../Input/DateInput";
 import { useState } from "react";
 import { Heading } from "../Helpers/Heading";
 import { Body } from "../Helpers/Body";
+import { RuleViewModel } from "@/lib/infrastructure/data/view-model/rule";
 
 type ListRuleUserDefineQuery = Partial<{
     account: string
@@ -36,7 +37,7 @@ type ListRuleUserDefineQuery = Partial<{
 
 export const ListRule = (
     props: {
-        comdom: UseComDOM<Rule>
+        comdom: UseComDOM<RuleViewModel>
     }
 ) => {
     const columnHelper = createColumnHelper<Rule>()
@@ -304,7 +305,7 @@ export const ListRule = (
             </Heading>
 
             <Body>
-                <StreamedTable<Rule>
+                <StreamedTable<RuleViewModel>
                     tablecomdom={props.comdom}
                     tablecolumns={tablecolumns}
                     tablestyling={{
diff --git a/src/component-library/Pages/Rule/PageRule.stories.tsx b/src/component-library/Pages/Rule/PageRule.stories.tsx
index fe4c2ae60..bfda84ce2 100644
--- a/src/component-library/Pages/Rule/PageRule.stories.tsx
+++ b/src/component-library/Pages/Rule/PageRule.stories.tsx
@@ -1,6 +1,7 @@
 import { StoryFn, Meta } from "@storybook/react";
-import { createRandomRulePageLockEntry, createRuleMeta, mockUseComDOM } from "test/fixtures/table-fixtures";
-import { PageRule as P, RulePageLockEntry } from "./PageRule";
+import { fixtureRulePageLockEntryViewModel, fixtureRuleMetaViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { PageRule as P } from "./PageRule";
+import { RulePageLockEntryViewModel } from "@/lib/infrastructure/data/view-model/rule";
 
 export default {
     title: 'Components/Pages/Rule',
@@ -11,6 +12,6 @@ const Template: StoryFn<typeof P> = (args) => <P {...args} />;
 
 export const PageRule = Template.bind({});
 PageRule.args = {
-    ruleMeta: createRuleMeta(),
-    ruleLocks: mockUseComDOM<RulePageLockEntry>(Array.from({length: 100}, () => createRandomRulePageLockEntry())),
+    ruleMeta: fixtureRuleMetaViewModel(),
+    ruleLocks: mockUseComDOM<RulePageLockEntryViewModel>(Array.from({length: 100}, () => fixtureRulePageLockEntryViewModel())),
 };
diff --git a/src/component-library/Pages/Rule/PageRule.tsx b/src/component-library/Pages/Rule/PageRule.tsx
index d06654a5b..c6d5d1f60 100644
--- a/src/component-library/Pages/Rule/PageRule.tsx
+++ b/src/component-library/Pages/Rule/PageRule.tsx
@@ -3,8 +3,6 @@ import { useState, useEffect } from "react"
 import { twMerge } from "tailwind-merge";
 var format = require("date-format")
 
-import { RuleMeta, RuleNotification } from "@/lib/core/entity/rucio";
-import { TableData } from "@/lib/infrastructure/data/view-model/streamedtables.d";
 import { LockState } from "@/lib/core/entity/rucio";
 import { Tabs } from "../../Misc/Tabs";
 import { SubPage } from "../../Helpers/SubPage";
@@ -25,19 +23,12 @@ import { Titleth, Contenttd, Generaltable } from "../../Helpers/Metatable";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
 import { Heading } from "../Helpers/Heading";
 import { Body } from "../Helpers/Body";
+import { RuleMetaViewModel, RulePageLockEntryViewModel } from "@/lib/infrastructure/data/view-model/rule";
 
-export interface RulePageLockEntry {
-    scope: string;
-    name: string;
-    rse: string;
-    state: LockState;
-    ddm_link: string;
-    fts_link: string;
-}
 
 export interface PageRulePageProps {
-    ruleMeta: RuleMeta;
-    ruleLocks: UseComDOM<RulePageLockEntry>
+    ruleMeta: RuleMetaViewModel;
+    ruleLocks: UseComDOM<RulePageLockEntryViewModel>
 }
 
 
@@ -56,7 +47,7 @@ export const PageRule = (
 
     const meta = props.ruleMeta;
 
-    const columnHelper = createColumnHelper<RulePageLockEntry>()
+    const columnHelper = createColumnHelper<RulePageLockEntryViewModel>()
     const tablecolumns = [
         columnHelper.accessor(row => `${row.scope}:${row.name}`, {
             id: "did",
diff --git a/src/component-library/Pages/Subscriptions/ListSubscription.stories.tsx b/src/component-library/Pages/Subscriptions/ListSubscription.stories.tsx
index b4aa0ec87..65be763a7 100644
--- a/src/component-library/Pages/Subscriptions/ListSubscription.stories.tsx
+++ b/src/component-library/Pages/Subscriptions/ListSubscription.stories.tsx
@@ -1,5 +1,5 @@
 import { StoryFn, Meta } from "@storybook/react";
-import { createSubscriptionRuleStates, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureSubscriptionRuleStatesViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { ListSubscription as L } from "./ListSubscription";
 
 export default {
@@ -11,5 +11,5 @@ const Template: StoryFn<typeof L> = (args) => <L {...args} />;
 
 export const ListSubscription = Template.bind({});
 ListSubscription.args = {
-    comdom: mockUseComDOM(Array.from({ length: 100 }, () => createSubscriptionRuleStates()))
+    comdom: mockUseComDOM(Array.from({ length: 100 }, () => fixtureSubscriptionRuleStatesViewModel()))
 };
diff --git a/src/component-library/Pages/Subscriptions/ListSubscription.tsx b/src/component-library/Pages/Subscriptions/ListSubscription.tsx
index 7eae3092e..03d90f118 100644
--- a/src/component-library/Pages/Subscriptions/ListSubscription.tsx
+++ b/src/component-library/Pages/Subscriptions/ListSubscription.tsx
@@ -1,4 +1,3 @@
-import { SubscriptionRuleStates } from "@/lib/core/entity/rucio";
 import { twMerge } from "tailwind-merge";
 import { H3 } from "../../Text/Headings/H3";
 import { P } from "../../Text/Content/P";
@@ -12,15 +11,16 @@ import { useState, useEffect } from "react";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
 import { Body } from "../Helpers/Body";
 import { Heading } from "../Helpers/Heading";
+import { SubscriptionRuleStatesViewModel } from "@/lib/infrastructure/data/view-model/subscriptions";
 
 export interface ListSubscriptionProps {
-    comdom: UseComDOM<SubscriptionRuleStates>
+    comdom: UseComDOM<SubscriptionRuleStatesViewModel>
 }
 
 export const ListSubscription = (
     props: ListSubscriptionProps
 ) => {
-    const columnHelper = createColumnHelper<SubscriptionRuleStates>()
+    const columnHelper = createColumnHelper<SubscriptionRuleStatesViewModel>()
     const tablecolumns = [
         columnHelper.accessor("name", {
             id: "name",
@@ -192,7 +192,7 @@ export const ListSubscription = (
         >
             <Heading title="List Subscriptions" />
             <Body>
-                <StreamedTable<SubscriptionRuleStates>
+                <StreamedTable<SubscriptionRuleStatesViewModel>
                     tablecomdom={props.comdom}
                     tablecolumns={tablecolumns}
                     tablestyling={{
diff --git a/src/component-library/StreamedTables/StreamedTable.stories.tsx b/src/component-library/StreamedTables/StreamedTable.stories.tsx
index 03eea5c2c..b5acca4fe 100644
--- a/src/component-library/StreamedTables/StreamedTable.stories.tsx
+++ b/src/component-library/StreamedTables/StreamedTable.stories.tsx
@@ -1,9 +1,9 @@
-import { DIDLong } from "@/lib/core/entity/rucio";
+import { DIDLongViewModel } from "@/lib/infrastructure/data/view-model/did";
 import { TableData } from "@/lib/infrastructure/data/view-model/streamedtables";
 import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
 import { StoryFn, Meta } from "@storybook/react";
 import { createColumnHelper, Column} from "@tanstack/react-table";
-import { createRandomDIDLong, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureDIDLongViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { StreamedTable as S } from "./StreamedTable";
 
 export default {
@@ -13,11 +13,11 @@ export default {
 
 const Template: StoryFn<typeof S> = (args) => <S {...args} />;
 
-const columnHelper = createColumnHelper<DIDLong>()
+const columnHelper = createColumnHelper<DIDLongViewModel>()
 
 export const StreamedTable = Template.bind({});
 StreamedTable.args = {
-    tablecomdom: mockUseComDOM<DIDLong>(Array.from({length: 5}, () => createRandomDIDLong())),
+    tablecomdom: mockUseComDOM<DIDLongViewModel>(Array.from({length: 5}, () => fixtureDIDLongViewModel())),
     tablecolumns: [
         columnHelper.accessor(row => `${row.scope}:${row.name}`, {
             id: "did",
diff --git a/src/component-library/StreamedTables/StreamedTable.tsx b/src/component-library/StreamedTables/StreamedTable.tsx
index 0cc015b0b..2278a45bb 100644
--- a/src/component-library/StreamedTables/StreamedTable.tsx
+++ b/src/component-library/StreamedTables/StreamedTable.tsx
@@ -9,7 +9,7 @@ import { UseComDOM } from "@/lib/infrastructure/hooks/useComDOM";
 import { TableFooter } from "./TableFooter";
 import { BaseViewModel } from "@/lib/sdk/view-models";
 
-type StreamedTableProps<T> = JSX.IntrinsicElements["table"] & {
+type StreamedTableProps<T extends BaseViewModel> = JSX.IntrinsicElements["table"] & {
     tablecomdom: UseComDOM<T>
     tablecolumns: any[] // todo type this
     tablestyling?: Partial<{
diff --git a/src/lib/core/entity/rucio.ts b/src/lib/core/entity/rucio.ts
index aa6b168e1..19dd1afc4 100644
--- a/src/lib/core/entity/rucio.ts
+++ b/src/lib/core/entity/rucio.ts
@@ -84,6 +84,15 @@ export type RuleMeta = {
     updated_at: DateISO
 }
 
+export type RulePageLockEntry = {
+    scope: string;
+    name: string;
+    rse: string;
+    state: LockState;
+    ddm_link: string;
+    fts_link: string;
+}
+
 export type Rule = {
     id: string;
     name: string;
diff --git a/src/lib/infrastructure/data/view-model/did.d.ts b/src/lib/infrastructure/data/view-model/did.d.ts
index 147ffdaac..8f95e3a82 100644
--- a/src/lib/infrastructure/data/view-model/did.d.ts
+++ b/src/lib/infrastructure/data/view-model/did.d.ts
@@ -1,6 +1,13 @@
-import { DID, DIDMeta } from "@/lib/core/entity/rucio";
+import { DID, DIDLong, DIDMeta } from "@/lib/core/entity/rucio";
 import { BaseViewModel } from "@/lib/sdk/view-models";
+import { DIDKeyValuePairs, DIDRules, DIDDatasetReplicas, FilereplicaState, FilereplicaStateD } from "./page-did";
 
-export interface DIDViewModel extends DID {}
+export interface DIDViewModel extends DID, BaseViewModel {}
+export interface DIDLongViewModel extends DIDLong, BaseViewModel {}
 
-export interface DIDMetaViewModel extends DIDMeta, BaseViewModel {}
\ No newline at end of file
+export interface DIDMetaViewModel extends DIDMeta, BaseViewModel {}
+export interface DIDKeyValuePairsViewModel extends DIDKeyValuePairs, BaseViewModel {}
+export interface DIDRulesViewModel extends DIDRules, BaseViewModel {}
+export interface DIDDatasetReplicasViewModel extends DIDDatasetReplicas, BaseViewModel {}
+export interface FilereplicaStateViewModel extends FilereplicaState, BaseViewModel {}
+export interface FilereplicaStateDViewModel extends FilereplicaStateD, BaseViewModel {}
\ No newline at end of file
diff --git a/src/lib/infrastructure/data/view-model/page-did.d.ts b/src/lib/infrastructure/data/view-model/page-did.d.ts
index df03579d3..fbae01a74 100644
--- a/src/lib/infrastructure/data/view-model/page-did.d.ts
+++ b/src/lib/infrastructure/data/view-model/page-did.d.ts
@@ -22,19 +22,6 @@ export type FilereplicaStateD = {
     temporary_unavailable: number,
 }
 
-export type DIDParents = {
-    name: string;
-    scope: string;
-    did_type: DIDType;
-}
-
-// Contents of a container
-export type DIDContents = {
-    name: string;
-    scope: string;
-    did_type: DIDType;
-}
-
 export type DIDDatasetReplicas = {
     rse: string;
     rseblocked: RSEBlockState;
diff --git a/src/lib/infrastructure/data/view-model/rse.d.ts b/src/lib/infrastructure/data/view-model/rse.d.ts
index ab512aae9..5e4a293a3 100644
--- a/src/lib/infrastructure/data/view-model/rse.d.ts
+++ b/src/lib/infrastructure/data/view-model/rse.d.ts
@@ -1,6 +1,6 @@
 import { DateISO } from "@/lib/core/entity/rucio"
 import { BaseViewModel } from "@/lib/sdk/view-models"
-import { RSE } from "@/lib/core/entity/rucio"
+import { RSE, RSEAccountUsageLimit } from "@/lib/core/entity/rucio"
 
 export type RSEProtocol = {
     rseid: string,
@@ -31,4 +31,10 @@ export type RSEAttribute = {
     value: string| DateISO | number | boolean | null,
 }
 
-export interface RSEViewModel extends RSE, BaseViewModel {}
\ No newline at end of file
+export interface RSEViewModel extends RSE, BaseViewModel {}
+
+export interface RSEProtocolViewModel extends RSEProtocol, BaseViewModel {}
+
+export interface RSEAttributeViewModel extends RSEAttribute, BaseViewModel {}
+
+export interface RSEAccountUsageLimitViewModel extends RSEAccountUsageLimit, BaseViewModel {}
\ No newline at end of file
diff --git a/src/lib/infrastructure/data/view-model/rule.d.ts b/src/lib/infrastructure/data/view-model/rule.d.ts
new file mode 100644
index 000000000..2b14b054e
--- /dev/null
+++ b/src/lib/infrastructure/data/view-model/rule.d.ts
@@ -0,0 +1,7 @@
+import { Rule } from "@/lib/core/entity/rucio";
+import { RulePageLockEntry, RuleMeta } from "@/lib/core/entity/rucio";
+import { BaseViewModel } from "@/lib/sdk/view-models";
+
+export interface RuleViewModel extends Rule, BaseViewModel {}
+export interface RulePageLockEntryViewModel extends RulePageLockEntry, BaseViewModel {}
+export interface RuleMetaViewModel extends RuleMeta, BaseViewModel {}
\ No newline at end of file
diff --git a/src/lib/infrastructure/data/view-model/subscriptions.ts b/src/lib/infrastructure/data/view-model/subscriptions.ts
index 0a2c7cedb..f219bd972 100644
--- a/src/lib/infrastructure/data/view-model/subscriptions.ts
+++ b/src/lib/infrastructure/data/view-model/subscriptions.ts
@@ -1,10 +1,12 @@
-import { Subscription, SubscriptionReplicationRule, SubscriptionState } from "@/lib/core/entity/rucio";
+import { Subscription, SubscriptionReplicationRule, SubscriptionState, SubscriptionRuleStates } from "@/lib/core/entity/rucio";
 import { BaseViewModel } from "@/lib/sdk/view-models";
 
 export interface SubscriptionViewModel extends BaseViewModel, Omit<Subscription, 'replication_rules'> {
     replication_rules: string
 }
 
+export interface SubscriptionRuleStatesViewModel extends BaseViewModel, SubscriptionRuleStates {}
+
 /**
  * A utility function to retrieve an empty {@link SubscriptionViewModel}.
  * @returns an empty SubscriptionViewModel
diff --git a/test/component/ListDID.test.tsx b/test/component/ListDID.test.tsx
index 52ffcbd27..46cbb94dc 100644
--- a/test/component/ListDID.test.tsx
+++ b/test/component/ListDID.test.tsx
@@ -5,7 +5,7 @@
 import { render, act, screen, cleanup, fireEvent } from "@testing-library/react";
 import { ListDID as ListDIDStory } from "@/component-library/Pages/DID/ListDID";
 import { DIDMeta } from "@/lib/core/entity/rucio";
-import { createDID, createDIDMeta, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureDIDViewModel, fixtureDIDMetaViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 import { DIDMetaViewModel } from "@/lib/infrastructure/data/view-model/did";
 var format = require("date-format")
 
@@ -13,7 +13,7 @@ describe("ListDID Story Test", () => {
     it("Checks empty render of the story", async () => {
         await act(async () => render(
             <ListDIDStory
-                comdom={mockUseComDOM(Array.from({length: 0}, () => createDID()))}
+                comdom={mockUseComDOM(Array.from({length: 0}, () => fixtureDIDViewModel()))}
                 didQuery={jest.fn(x => console.log(x))}
                 didMetaQuery={jest.fn(x => console.log(x))}
                 didMetaQueryResponse={{} as DIDMetaViewModel}
@@ -61,10 +61,10 @@ describe("ListDID Story Test", () => {
             SOLUTION:
             remove `aria-label` from the table rows, grab table rows differently.
         */
-        const mockDIDMeta = createDIDMeta()
+        const mockDIDMeta = fixtureDIDMetaViewModel()
         await act(async () => render(
             <ListDIDStory
-                comdom={mockUseComDOM(Array.from({length: 100}, () => createDID()))}
+                comdom={mockUseComDOM(Array.from({length: 100}, () => fixtureDIDViewModel()))}
                 didMetaQuery={jest.fn(x => console.log(x))}
                 didMetaQueryResponse={mockDIDMeta}
             />
diff --git a/test/component/PageRule.test.tsx b/test/component/PageRule.test.tsx
index 0a0bac4ed..131b8d3aa 100644
--- a/test/component/PageRule.test.tsx
+++ b/test/component/PageRule.test.tsx
@@ -5,17 +5,17 @@
 import { render, act, screen, cleanup, fireEvent, getByRole } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { PageRule as PageRuleStory } from "@/component-library/Pages/Rule/PageRule";
-import { createRandomRulePageLockEntry, createRuleMeta, mockUseComDOM } from "test/fixtures/table-fixtures";
+import { fixtureRulePageLockEntryViewModel, fixtureRuleMetaViewModel, mockUseComDOM } from "test/fixtures/table-fixtures";
 var format = require("date-format")
 
-const ruleMeta = createRuleMeta()
+const ruleMeta = fixtureRuleMetaViewModel()
 
 describe("PageRule Story Test", () => {
     it("Check Subpage Movement", async () => {
         await act(async () => render(
             <PageRuleStory
                 ruleMeta={ruleMeta}
-                ruleLocks={mockUseComDOM(Array.from({length: 100}, (v,k) => createRandomRulePageLockEntry()))}
+                ruleLocks={mockUseComDOM(Array.from({length: 100}, (v,k) => fixtureRulePageLockEntryViewModel()))}
             />
         ))
         const user = userEvent.setup()
diff --git a/test/fixtures/table-fixtures.ts b/test/fixtures/table-fixtures.ts
index 3566aa725..aac20e84d 100644
--- a/test/fixtures/table-fixtures.ts
+++ b/test/fixtures/table-fixtures.ts
@@ -1,21 +1,19 @@
 import { faker } from '@faker-js/faker'
-import { RulePageLockEntry } from '@/component-library/Pages/Rule/PageRule'
 import {
-    LockState, DID, DIDLong, DIDMeta, DIDType, RuleMeta, RuleNotification, RuleState,
-    RSEBlockState, Subscription, SubscriptionRuleStates, SubscriptionState,
-    DIDAvailability, RSEAccountUsageLimit,
+    LockState, DIDType, RuleNotification, RuleState,
+    RSEBlockState, SubscriptionState,
+    DIDAvailability,
     ReplicaState,
-    RSE, RSEType, Rule
+    RSEType,
 } from '@/lib/core/entity/rucio'
-import {
-    DIDDatasetReplicas, DIDRules, FilereplicaState, FilereplicaStateD
-} from '@/lib/infrastructure/data/view-model/page-did';
-import { RSEAttribute, RSEProtocol } from '@/lib/infrastructure/data/view-model/rse';
+import { RSEAccountUsageLimitViewModel, RSEAttributeViewModel, RSEProtocolViewModel, RSEViewModel } from '@/lib/infrastructure/data/view-model/rse';
 import { UseComDOM } from '@/lib/infrastructure/hooks/useComDOM';
-import { SubscriptionViewModel } from '@/lib/infrastructure/data/view-model/subscriptions';
+import { SubscriptionRuleStatesViewModel, SubscriptionViewModel } from '@/lib/infrastructure/data/view-model/subscriptions';
 import { BaseViewModel } from '@/lib/sdk/view-models';
+import { DIDDatasetReplicasViewModel, DIDKeyValuePairsViewModel, DIDLongViewModel, DIDMetaViewModel, DIDRulesViewModel, DIDViewModel, FilereplicaStateDViewModel, FilereplicaStateViewModel } from '@/lib/infrastructure/data/view-model/did';
+import { RuleMetaViewModel, RulePageLockEntryViewModel, RuleViewModel } from '@/lib/infrastructure/data/view-model/rule';
 
-export function mockUseComDOM<T>(data: T[]): UseComDOM<T> {
+export function mockUseComDOM<T extends BaseViewModel>(data: T[]): UseComDOM<T> {
     return {
         query: {
             data: data,
@@ -65,16 +63,18 @@ function createRSEExpression(): string {
     return strings.join("&")
 }
 
-export function createDID(): DID {
+export function fixtureDIDViewModel(): DIDViewModel {
     return {
+        ...mockBaseVM(),
         scope: createRandomScope(),
         name: faker.lorem.words(3).replace(/\s/g, "."),
         did_type: randomEnum<DIDType>(DIDType),
     }
 }
 
-export function createRandomDIDLong(): DIDLong {
+export function fixtureDIDLongViewModel(): DIDLongViewModel {
     return {
+        ...mockBaseVM(),
         scope: createRandomScope(),
         name: faker.lorem.words(3).replace(/\s/g, "."),
         did_type: randomEnum<DIDType>(DIDType),
@@ -83,8 +83,9 @@ export function createRandomDIDLong(): DIDLong {
     }
 }
 
-export function createRandomRulePageLockEntry(): RulePageLockEntry {
+export function fixtureRulePageLockEntryViewModel(): RulePageLockEntryViewModel {
     return {
+        ...mockBaseVM(),
         scope: createRandomScope(),
         name: faker.string.alphanumeric(10),
         rse: createRSEName(),
@@ -94,8 +95,9 @@ export function createRandomRulePageLockEntry(): RulePageLockEntry {
     }
 }
 
-export function createRuleMeta(): RuleMeta {
+export function fixtureRuleMetaViewModel(): RuleMetaViewModel {
     return {
+        ...mockBaseVM(),
         account: faker.internet.userName(),
         activity: faker.company.buzzPhrase(),
         copies: faker.number.int({ min: 1, max: 10 }),
@@ -122,8 +124,9 @@ export function createRuleMeta(): RuleMeta {
     }
 }
 
-export function createRSEAccountUsageLimit(): RSEAccountUsageLimit {
+export function fixtureRSEAccountUsageLimitViewModel(): RSEAccountUsageLimitViewModel {
     return {
+        ...mockBaseVM(),
         rse_id: faker.string.uuid(),
         rse: createRSEName(),
         account: faker.internet.userName(),
@@ -133,8 +136,9 @@ export function createRSEAccountUsageLimit(): RSEAccountUsageLimit {
     }
 }
 
-export function createRSE(): RSE {
+export function fixtureRSEViewModel(): RSEViewModel {
     return {
+        ...mockBaseVM(),
         id: faker.string.uuid(),
         name: createRSEName(),
         rse_type: randomEnum<RSEType>(RSEType),
@@ -144,8 +148,9 @@ export function createRSE(): RSE {
     }
 }
 
-export function createRSEProtocol(): RSEProtocol {
+export function fixtureRSEProtocolViewModel(): RSEProtocolViewModel {
     return {
+        ...mockBaseVM(),
         rseid: faker.string.uuid(),
         scheme: faker.helpers.arrayElement(["srm", "gsiftp", "root", "davs", "s3", "file"]),
         hostname: faker.internet.ip(),
@@ -170,8 +175,9 @@ export function createRSEProtocol(): RSEProtocol {
     }
 }
 
-export function createRSEAttribute(): RSEAttribute {
+export function fixtureRSEAttributeViewModel(): RSEAttributeViewModel {
     return {
+        ...mockBaseVM(),
         key: faker.lorem.words(2).replace(/\s/g, "-"),
         value: faker.helpers.arrayElement([
             faker.lorem.words(3),
@@ -183,8 +189,9 @@ export function createRSEAttribute(): RSEAttribute {
     }
 }
 
-export function createRule(): Rule {
+export function fixtureRuleViewModel(): RuleViewModel {
     return {
+        ...mockBaseVM(),
         id: faker.string.uuid(),
         name: faker.lorem.words(3).replace(/\s/g, "."),
         account: faker.internet.userName(),
@@ -198,10 +205,11 @@ export function createRule(): Rule {
     }
 }
 
-export function createDIDMeta(): DIDMeta {
+export function fixtureDIDMetaViewModel(): DIDMetaViewModel {
     // ignore Collections
     const did_type = faker.helpers.arrayElement<DIDType>([DIDType.CONTAINER, DIDType.DATASET, DIDType.FILE])
     return {
+        ...mockBaseVM(),
         name: faker.lorem.words(3).replace(/\s/g, "."),
         scope: createRandomScope(),
         account: faker.internet.userName(),
@@ -224,8 +232,23 @@ export function createDIDMeta(): DIDMeta {
     }
 }
 
-export function createDIDDatasetReplicas(): DIDDatasetReplicas {
+export function fixtureDIDKeyValuePairsViewModel(): DIDKeyValuePairsViewModel {
+    return {
+        ...mockBaseVM(),
+        key: faker.lorem.words(2).replace(/\s/g, "-"),
+        value: faker.helpers.arrayElement([
+            "das brot",
+            faker.date.past().toISOString(),
+            faker.datatype.boolean(),
+            faker.number.int({ min: 0, max: 1e6 }),
+            null,
+        ])
+    }
+}
+
+export function fixtureDIDDatasetReplicasViewModel(): DIDDatasetReplicasViewModel {
     return {
+        ...mockBaseVM(),
         rse: createRSEName(),
         rseblocked: faker.number.int({ min: 0, max: 7 }) as RSEBlockState,
         availability: faker.datatype.boolean(),
@@ -236,8 +259,9 @@ export function createDIDDatasetReplicas(): DIDDatasetReplicas {
     }
 }
 
-export function createDIDRules(): DIDRules {
+export function fixtureDIDRulesViewModel(): DIDRulesViewModel {
     return {
+        ...mockBaseVM(),
         id: faker.string.uuid(),
         name: faker.lorem.words(3).replace(/\s/g, "."),
         state: randomEnum<RuleState>(RuleState),
@@ -247,15 +271,17 @@ export function createDIDRules(): DIDRules {
     }
 }
 
-export function createFileReplicaState(): FilereplicaState {
+export function fixtureFilereplicaStateViewModel(): FilereplicaStateViewModel {
     return {
+        ...mockBaseVM(),
         rse: createRSEName(),
         state: randomEnum<ReplicaState>(ReplicaState),
     }
 }
 
-export function createFileReplicaStateD(): FilereplicaStateD {
+export function fixtureFilereplicaStateDViewModel(): FilereplicaStateDViewModel {
     return {
+        ...mockBaseVM(),
         scope: createRandomScope(),
         name: faker.lorem.words(3).replace(/\s/g, "."),
         available: faker.number.int({ min: 0, max: 10 }),
@@ -267,9 +293,9 @@ export function createFileReplicaStateD(): FilereplicaStateD {
     }
 }
 
-
-export function createSubscriptionRuleStates(): SubscriptionRuleStates {
+export function fixtureSubscriptionRuleStatesViewModel(): SubscriptionRuleStatesViewModel {
     return {
+        ...mockBaseVM(),
         name: faker.lorem.words(3).replace(/\s/g, "."),
         state_ok: faker.number.int({ min: 0, max: 10 }),
         state_replicating: faker.number.int({ min: 0, max: 10 }),