diff --git a/package-lock.json b/package-lock.json
index 378b7ff9a84..31f5cd4fc73 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23176,6 +23176,15 @@
       "integrity": "sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==",
       "dev": true
     },
+    "node_modules/cronstrue": {
+      "version": "2.41.0",
+      "resolved": "https://registry.npmjs.org/cronstrue/-/cronstrue-2.41.0.tgz",
+      "integrity": "sha512-3ZS3eMJaxMRBGmDauKCKbyIRgVcph6uSpkhSbbZvvJWkelHiSTzGJbBqmu8io7Hspd2F45bQKnC1kzoNvtku2g==",
+      "dev": true,
+      "bin": {
+        "cronstrue": "bin/cli.js"
+      }
+    },
     "node_modules/cross-fetch": {
       "version": "3.1.6",
       "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-3.1.6.tgz",
@@ -44716,6 +44725,7 @@
         "autoprefixer": "^10.4.13",
         "axios": "^0.27.2",
         "cookie": "^0.4.1",
+        "cronstrue": "^2.41.0",
         "eslint": "^8.16.0",
         "eslint-config-prettier": "^8.3.0",
         "eslint-plugin-svelte3": "^4.0.0",
diff --git a/web-admin/package.json b/web-admin/package.json
index 4555e75c380..2357ce09cf4 100644
--- a/web-admin/package.json
+++ b/web-admin/package.json
@@ -16,9 +16,9 @@
     "@fontsource/fira-mono": "^4.5.0",
     "@playwright/test": "^1.25.0",
     "@rgossiaux/svelte-headlessui": "^2.0.0",
+    "@rilldata/svelte-query": "^4.29.20-0.0.1",
     "@sveltejs/adapter-static": "^1.0.0",
     "@sveltejs/kit": "^1.5.0",
-    "@rilldata/svelte-query": "^4.29.20-0.0.1",
     "@tanstack/svelte-query": "npm:@rilldata/svelte-query@4.29.20-0.0.1",
     "@types/cookie": "^0.5.1",
     "@typescript-eslint/eslint-plugin": "^5.27.0",
@@ -26,6 +26,7 @@
     "autoprefixer": "^10.4.13",
     "axios": "^0.27.2",
     "cookie": "^0.4.1",
+    "cronstrue": "^2.41.0",
     "eslint": "^8.16.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-svelte3": "^4.0.0",
diff --git a/web-admin/src/features/dashboards/listing/DashboardsTableHeader.svelte b/web-admin/src/features/dashboards/listing/DashboardsTableHeader.svelte
index a2aeb00efe7..33f3e5fb07b 100644
--- a/web-admin/src/features/dashboards/listing/DashboardsTableHeader.svelte
+++ b/web-admin/src/features/dashboards/listing/DashboardsTableHeader.svelte
@@ -46,7 +46,7 @@
       class="pl-2 pr-4 py-2 max-w-[800px] flex items-center gap-x-2 bg-slate-100"
     >
       <!-- Search bar -->
-      <div class="px-4 grow">
+      <div class="px-2 grow">
         <Search placeholder="Search" autofocus={false} bind:value={filter} />
       </div>
 
diff --git a/web-admin/src/features/projects/ProjectTabs.svelte b/web-admin/src/features/projects/ProjectTabs.svelte
index 931297b00fc..526bf1d6e30 100644
--- a/web-admin/src/features/projects/ProjectTabs.svelte
+++ b/web-admin/src/features/projects/ProjectTabs.svelte
@@ -19,11 +19,10 @@
             route: `/${organization}/${project}`,
             label: "Dashboards",
           },
-          // Hide until releasing Scheduled Reports
-          // {
-          //   route: `/${organization}/${project}/-/reports`,
-          //   label: "Reports",
-          // },
+          {
+            route: `/${organization}/${project}/-/reports`,
+            label: "Reports",
+          },
         ];
         const adminTabs = [
           {
diff --git a/web-admin/src/features/scheduled-reports/listing/NoReportsCTA.svelte b/web-admin/src/features/scheduled-reports/listing/NoReportsCTA.svelte
new file mode 100644
index 00000000000..a013d36ccf7
--- /dev/null
+++ b/web-admin/src/features/scheduled-reports/listing/NoReportsCTA.svelte
@@ -0,0 +1,25 @@
+<script lang="ts">
+  import ReportIcon from "@rilldata/web-common/components/icons/ReportIcon.svelte";
+</script>
+
+<div
+  class="m-auto mt-20 pb-10 flex-col justify-center items-center gap-y-4 inline-flex"
+>
+  <div class="flex flex-col justify-center items-center">
+    <div class="relative">
+      <ReportIcon className="text-slate-300 w-12 h-12" />
+    </div>
+  </div>
+  <div
+    class="flex flex-col gap-y-2 justify-center items-center text-center text-sm"
+  >
+    <div class="text-gray-600 font-semibold">
+      You don't have any reports yet
+    </div>
+    <div>
+      <span style="text-gray-500 font-normal"
+        >Learn how to create a report in our
+      </span><a href="https://docs.rilldata.com/" target="_blank">docs</a>
+    </div>
+  </div>
+</div>
diff --git a/web-admin/src/features/scheduled-reports/listing/ReportsError.svelte b/web-admin/src/features/scheduled-reports/listing/ReportsError.svelte
new file mode 100644
index 00000000000..6d794cc43c2
--- /dev/null
+++ b/web-admin/src/features/scheduled-reports/listing/ReportsError.svelte
@@ -0,0 +1,15 @@
+<script lang="ts">
+</script>
+
+<div
+  class="m-auto mt-20 pb-10 flex-col justify-center items-center gap-y-4 inline-flex"
+>
+  <div
+    class="flex flex-col gap-y-2 justify-center items-center text-center text-sm"
+  >
+    <div class="text-gray-600 font-semibold">Error loading reports</div>
+    <div class="text-gray-500 font-normal">
+      If this error persists, please contact support.
+    </div>
+  </div>
+</div>
diff --git a/web-admin/src/features/scheduled-reports/listing/ReportsTable.svelte b/web-admin/src/features/scheduled-reports/listing/ReportsTable.svelte
new file mode 100644
index 00000000000..41ea991722a
--- /dev/null
+++ b/web-admin/src/features/scheduled-reports/listing/ReportsTable.svelte
@@ -0,0 +1,90 @@
+<script lang="ts">
+  import Spinner from "@rilldata/web-common/features/entity-management/Spinner.svelte";
+  import { EntityStatus } from "@rilldata/web-common/features/entity-management/types";
+  import type { V1Resource } from "@rilldata/web-common/runtime-client";
+  import { runtime } from "@rilldata/web-common/runtime-client/runtime-store";
+  import { ColumnDef, flexRender } from "@tanstack/svelte-table";
+  import Table from "../../../components/table/Table.svelte";
+  import { useReports } from "../selectors";
+  import NoReportsCTA from "./NoReportsCTA.svelte";
+  import ReportsError from "./ReportsError.svelte";
+  import ReportsTableCompositeCell from "./ReportsTableCompositeCell.svelte";
+  import ReportsTableEmpty from "./ReportsTableEmpty.svelte";
+  import ReportsTableHeader from "./ReportsTableHeader.svelte";
+
+  export let organization: string;
+  export let project: string;
+
+  $: reports = useReports($runtime.instanceId);
+
+  /**
+   * Table column definitions.
+   * - "composite": Renders all dashboard data in a single cell.
+   * - Others: Used for sorting and filtering but not displayed.
+   *
+   * Note: TypeScript error prevents using `ColumnDef<DashboardResource, string>[]`.
+   * Relevant issues:
+   * - https://github.com/TanStack/table/issues/4241
+   * - https://github.com/TanStack/table/issues/4302
+   */
+  const columns: ColumnDef<V1Resource, string>[] = [
+    {
+      id: "composite",
+      cell: (info) =>
+        flexRender(ReportsTableCompositeCell, {
+          organization: organization,
+          project: project,
+          id: info.row.original.meta.name.name,
+          title: info.row.original.report.spec.title,
+          lastRun:
+            info.row.original.report.state.executionHistory[0]?.reportTime,
+          frequency: info.row.original.report.spec.refreshSchedule.cron,
+          ownerId:
+            info.row.original.report.spec.annotations["admin_owner_user_id"],
+          lastRunErrorMessage:
+            info.row.original.report.state.executionHistory[0]?.errorMessage,
+        }),
+    },
+    {
+      id: "name",
+      accessorFn: (row) => row.meta.name.name,
+    },
+    {
+      id: "lastRun",
+      accessorFn: (row) => row.report.state.currentExecution.reportTime,
+    },
+    // {
+    //   id: "nextRun",
+    //   accessorFn: (row) => row.nextRun,
+    // },
+    // {
+    //   id: "actions",
+    //   cell: ({ row }) =>
+    //     flexRender(ReportsTableActionCell, {
+    //       title: row.original.name,
+    //     }),
+    // },
+  ];
+
+  const columnVisibility = {
+    name: false,
+    lastRun: false,
+  };
+</script>
+
+{#if $reports.isLoading}
+  <div class="m-auto mt-20">
+    <Spinner status={EntityStatus.Running} size="24px" />
+  </div>
+{:else if $reports.isError}
+  <ReportsError />
+{:else if $reports.isSuccess}
+  {#if $reports.data.resources.length === 0}
+    <NoReportsCTA />
+  {:else}
+    <Table {columns} data={$reports?.data?.resources} {columnVisibility}>
+      <ReportsTableHeader slot="header" />
+      <ReportsTableEmpty slot="empty" />
+    </Table>
+  {/if}
+{/if}
diff --git a/web-admin/src/features/scheduled-reports/listing/ReportsTableActionCell.svelte b/web-admin/src/features/scheduled-reports/listing/ReportsTableActionCell.svelte
new file mode 100644
index 00000000000..924bf3c7d95
--- /dev/null
+++ b/web-admin/src/features/scheduled-reports/listing/ReportsTableActionCell.svelte
@@ -0,0 +1,16 @@
+<script lang="ts">
+  import ThreeDot from "@rilldata/web-common/components/icons/ThreeDot.svelte";
+
+  export let reportName: string;
+</script>
+
+<button
+  class="text-gray-500 hover:text-blue-500 hover:bg-slate-200 grid place-items-center rounded-sm"
+  on:click={() => console.log(`open actions for ${reportName}`)}
+>
+  <ThreeDot size="16px" />
+</button>
+
+<!-- TODO: Menu for admins -->
+
+<!-- TODO: Menu for viewers -->
diff --git a/web-admin/src/features/scheduled-reports/listing/ReportsTableCompositeCell.svelte b/web-admin/src/features/scheduled-reports/listing/ReportsTableCompositeCell.svelte
new file mode 100644
index 00000000000..2395f9970e8
--- /dev/null
+++ b/web-admin/src/features/scheduled-reports/listing/ReportsTableCompositeCell.svelte
@@ -0,0 +1,54 @@
+<script lang="ts">
+  import CancelCircleInverse from "@rilldata/web-common/components/icons/CancelCircleInverse.svelte";
+  import CheckCircleOutline from "@rilldata/web-common/components/icons/CheckCircleOutline.svelte";
+  import ReportIcon from "@rilldata/web-common/components/icons/ReportIcon.svelte";
+  import cronstrue from "cronstrue";
+  import { createAdminServiceListProjectMembers } from "../../../client";
+  import { formatDateToCustomString } from "../tableUtils";
+
+  export let organization: string;
+  export let project: string;
+  export let id: string;
+  export let title: string;
+  export let lastRun: string | undefined;
+  export let frequency: string;
+  export let ownerId: string;
+  export let lastRunErrorMessage: string | undefined;
+
+  const humanReadableFrequency = cronstrue.toString(frequency);
+
+  const membersQuery = createAdminServiceListProjectMembers(
+    organization,
+    project
+  );
+  $: owner = $membersQuery.data?.members.find(
+    (member) => member.userId === ownerId
+  );
+</script>
+
+<a href={`reports/${id}`} class="flex flex-col gap-y-0.5 group px-4 py-[5px]">
+  <div class="flex gap-x-2 items-center">
+    <ReportIcon size={"14px"} className="text-slate-500" />
+    <div class="text-gray-700 text-sm font-semibold group-hover:text-blue-600">
+      {title}
+    </div>
+    {#if lastRun}
+      {#if lastRunErrorMessage}
+        <CancelCircleInverse className="text-red-500" />
+      {:else}
+        <CheckCircleOutline className="text-blue-500" />
+      {/if}
+    {/if}
+  </div>
+  <div class="flex gap-x-1 text-gray-500 text-xs font-normal">
+    {#if !lastRun}
+      <span>Hasn't run yet</span>
+    {:else}
+      <span>Last run {formatDateToCustomString(new Date(lastRun))}</span>
+    {/if}
+    <span>•</span>
+    <span>{humanReadableFrequency}</span>
+    <span>•</span>
+    <span>Created by {owner?.userName || "a project admin"}</span>
+  </div>
+</a>
diff --git a/web-admin/src/features/scheduled-reports/listing/ReportsTableEmpty.svelte b/web-admin/src/features/scheduled-reports/listing/ReportsTableEmpty.svelte
new file mode 100644
index 00000000000..aee2025eb5d
--- /dev/null
+++ b/web-admin/src/features/scheduled-reports/listing/ReportsTableEmpty.svelte
@@ -0,0 +1 @@
+<span class="text-gray-500"> No reports found. </span>
diff --git a/web-admin/src/features/scheduled-reports/listing/ReportsTableHeader.svelte b/web-admin/src/features/scheduled-reports/listing/ReportsTableHeader.svelte
new file mode 100644
index 00000000000..7aca7d5a172
--- /dev/null
+++ b/web-admin/src/features/scheduled-reports/listing/ReportsTableHeader.svelte
@@ -0,0 +1,103 @@
+<script lang="ts">
+  import { Search } from "@rilldata/web-common/components/search";
+  import type { Table } from "@tanstack/table-core/src/types";
+  import { getContext } from "svelte";
+  import type { Readable } from "svelte/store";
+
+  const table = getContext("table") as Readable<Table<unknown>>;
+
+  // Search
+  let filter = "";
+
+  $: filterTable(filter);
+
+  function filterTable(filter: string) {
+    $table.setGlobalFilter(filter);
+  }
+
+  // Number of reports
+  $: numReports = $table.getRowModel().rows.length;
+
+  // Sort
+  // function sortAlphabetically() {
+  //   $table.setSorting([{ id: "monocolumn", desc: false }]);
+  // }
+
+  // function sortByMostRecentlyRun() {
+  //   $table.setSorting([{ id: "lastRun", desc: true }]);
+  // }
+
+  // function sortByNextToRun() {
+  //   $table.setSorting([{ id: "monocolumn", desc: false }]);
+  // }
+
+  // let openSortMenu = false;
+  // function closeSortMenu() {
+  //   openSortMenu = false;
+  // }
+</script>
+
+<thead>
+  <tr>
+    <td
+      class="pl-2 pr-4 py-2 max-w-[800px] flex items-center gap-x-2 bg-slate-100"
+    >
+      <!-- Search bar -->
+      <div class="px-2 grow">
+        <Search placeholder="Search" autofocus={false} bind:value={filter} />
+      </div>
+
+      <!-- Spacer -->
+      <div class="grow" />
+
+      <!-- filter menu button (future work) -->
+      <!-- <Button on:click={() => console.log("open filter menu")} type="secondary">
+    <span>Filter</span>
+    <CaretDownIcon />
+  </Button> -->
+
+      <!-- Number of reports -->
+      <span class="shrink-0"
+        >{numReports} report{numReports !== 1 ? "s" : ""}</span
+      >
+
+      <!-- Sort button -->
+      <!-- <WithTogglableFloatingElement active={openSortMenu}>
+        <Button on:click={() => (openSortMenu = true)} type="secondary">
+          <span>Sort</span>
+          <CaretDownIcon />
+        </Button>
+        <Menu
+          slot="floating-element"
+          minWidth="0px"
+          on:item-select={closeSortMenu}
+          on:click-outside={closeSortMenu}
+          on:escape={closeSortMenu}
+        >
+          <MenuItem on:select={sortAlphabetically}>Alphabetical</MenuItem>
+          <MenuItem on:select={sortByMostRecentlyRun}
+            >Most recently run</MenuItem
+          >
+          <MenuItem on:select={sortByNextToRun} disabled>Next to run</MenuItem>
+        </Menu>
+      </WithTogglableFloatingElement> -->
+    </td>
+  </tr>
+</thead>
+
+<!-- 
+Rounded table corners are tricky:
+- `border-radius` does not apply to table elements when `border-collapse` is `collapse`.
+- You can only apply `border-radius` to <td>, not <tr> or <table>.
+-->
+<style lang="postcss">
+  thead tr td {
+    @apply border-y;
+  }
+  thead tr td:first-child {
+    @apply border-l rounded-tl-sm;
+  }
+  thead tr td:last-child {
+    @apply border-r rounded-tr-sm;
+  }
+</style>
diff --git a/web-admin/src/features/scheduled-reports/selectors.ts b/web-admin/src/features/scheduled-reports/selectors.ts
new file mode 100644
index 00000000000..0068a982bb1
--- /dev/null
+++ b/web-admin/src/features/scheduled-reports/selectors.ts
@@ -0,0 +1,18 @@
+import { ResourceKind } from "@rilldata/web-common/features/entity-management/resource-selectors";
+import {
+  createRuntimeServiceGetResource,
+  createRuntimeServiceListResources,
+} from "@rilldata/web-common/runtime-client";
+
+export function useReports(instanceId: string) {
+  return createRuntimeServiceListResources(instanceId, {
+    kind: ResourceKind.Report,
+  });
+}
+
+export function useReport(instanceId: string, name: string) {
+  return createRuntimeServiceGetResource(instanceId, {
+    "name.name": name,
+    "name.kind": ResourceKind.Report,
+  });
+}
diff --git a/web-admin/src/features/scheduled-reports/tableUtils.ts b/web-admin/src/features/scheduled-reports/tableUtils.ts
new file mode 100644
index 00000000000..120ce06f09c
--- /dev/null
+++ b/web-admin/src/features/scheduled-reports/tableUtils.ts
@@ -0,0 +1,20 @@
+export function formatDateToCustomString(date: Date) {
+  const formattedDate = date.toLocaleString("en-US", {
+    month: "short",
+    day: "2-digit",
+    year: "numeric",
+    hour: "numeric",
+    minute: "2-digit",
+    hour12: true,
+  });
+
+  const dateParts = formattedDate.split(", ");
+  dateParts[0] = dateParts[0] + " " + dateParts[1];
+  dateParts.splice(1, 1);
+
+  return dateParts.join(", ").replace(" PM", "pm").replace(" AM", "am");
+}
+
+export function capitalizeFirstLetter(string: string) {
+  return string.charAt(0).toUpperCase() + string.slice(1);
+}
diff --git a/web-admin/src/routes/[organization]/[project]/-/reports/+page.svelte b/web-admin/src/routes/[organization]/[project]/-/reports/+page.svelte
new file mode 100644
index 00000000000..0421bd8f15d
--- /dev/null
+++ b/web-admin/src/routes/[organization]/[project]/-/reports/+page.svelte
@@ -0,0 +1,17 @@
+<script lang="ts">
+  import { page } from "$app/stores";
+  import ContentContainer from "@rilldata/web-admin/components/layout/ContentContainer.svelte";
+  import VerticalScrollContainer from "@rilldata/web-common/layout/VerticalScrollContainer.svelte";
+  import ReportsTable from "../../../../../features/scheduled-reports/listing/ReportsTable.svelte";
+
+  $: organization = $page.params.organization;
+  $: project = $page.params.project;
+</script>
+
+<VerticalScrollContainer>
+  <ContentContainer>
+    <div class="flex flex-col items-center">
+      <ReportsTable {organization} {project} />
+    </div>
+  </ContentContainer>
+</VerticalScrollContainer>
diff --git a/web-common/src/components/icons/CancelCircleInverse.svelte b/web-common/src/components/icons/CancelCircleInverse.svelte
index a99ae2f3075..935f5510b82 100644
--- a/web-common/src/components/icons/CancelCircleInverse.svelte
+++ b/web-common/src/components/icons/CancelCircleInverse.svelte
@@ -13,12 +13,12 @@
 >
   <path
     d="M60.5834 24.9336C61.4783 24.0387 62.9293 24.0387 63.8243 24.9336L67.0652 28.1746C67.9601 29.0695 67.9601 30.5205 67.0652 31.4155L52.4813 45.9994L67.0654 60.5835C67.9604 61.4784 67.9604 62.9294 67.0654 63.8244L63.8245 67.0653C62.9296 67.9603 61.4786 67.9603 60.5836 67.0653L45.9995 52.4812L31.4152 67.0654C30.5203 67.9604 29.0693 67.9604 28.1743 67.0654L24.9334 63.8245C24.0385 62.9296 24.0385 61.4786 24.9334 60.5836L39.5177 45.9994L24.9336 31.4153C24.0387 30.5204 24.0387 29.0694 24.9336 28.1744L28.1746 24.9335C29.0695 24.0386 30.5205 24.0386 31.4155 24.9335L45.9995 39.5175L60.5834 24.9336Z"
-    fill="#E5E7EB"
+    fill={color}
   />
   <path
     fill-rule="evenodd"
     clip-rule="evenodd"
     d="M45.9994 91.8327C71.3124 91.8327 91.8327 71.3124 91.8327 45.9994C91.8327 20.6863 71.3124 0.166016 45.9994 0.166016C20.6863 0.166016 0.166016 20.6863 0.166016 45.9994C0.166016 71.3124 20.6863 91.8327 45.9994 91.8327ZM45.9994 82.666C66.2498 82.666 82.666 66.2498 82.666 45.9994C82.666 25.7489 66.2498 9.33268 45.9994 9.33268C25.7489 9.33268 9.33268 25.7489 9.33268 45.9994C9.33268 66.2498 25.7489 82.666 45.9994 82.666Z"
-    fill="#E5E7EB"
+    fill={color}
   />
 </svg>
diff --git a/web-common/src/components/icons/CheckCircleOutline.svelte b/web-common/src/components/icons/CheckCircleOutline.svelte
new file mode 100644
index 00000000000..c492fe5d8b0
--- /dev/null
+++ b/web-common/src/components/icons/CheckCircleOutline.svelte
@@ -0,0 +1,24 @@
+<script lang="ts">
+  export let size = "1em";
+  export let color = "currentColor";
+  export let className = "";
+</script>
+
+<svg
+  height={size}
+  viewBox="0 0 24 24"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+  class={className}
+>
+  <path
+    d="M17.5216 9.45423C17.6892 9.24518 17.6622 8.94119 17.4604 8.76493L16.5248 7.94757C16.3087 7.75879 15.9783 7.79023 15.8017 8.01641L11.1942 13.9171L8.9537 11.6906C8.7593 11.4974 8.44559 11.4967 8.25035 11.6891L7.35844 12.5678C7.16084 12.7625 7.15948 13.0808 7.35541 13.2771L11.2933 17.2236L17.5216 9.45423Z"
+    fill={color}
+  />
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12ZM20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12Z"
+    fill={color}
+  />
+</svg>
diff --git a/web-common/src/components/icons/ReportIcon.svelte b/web-common/src/components/icons/ReportIcon.svelte
new file mode 100644
index 00000000000..ba424c2e67f
--- /dev/null
+++ b/web-common/src/components/icons/ReportIcon.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+  export let size = "1em";
+  export let color = "currentColor";
+  export let className = "";
+</script>
+
+<svg
+  height={size}
+  viewBox="0 0 24 24"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+  class={className}
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M3.87868 1.87868C4.44129 1.31607 5.20435 1 6 1H14.5C14.7652 1 15.0196 1.10536 15.2071 1.29289L20.7071 6.79289C20.8946 6.98043 21 7.23478 21 7.5V20C21 20.7957 20.6839 21.5587 20.1213 22.1213C19.5587 22.6839 18.7957 23 18 23H6C5.20435 23 4.44129 22.6839 3.87868 22.1213C3.31607 21.5587 3 20.7957 3 20V4C3 3.20435 3.31607 2.44129 3.87868 1.87868ZM18.0858 7L15 3.91421V7H18.0858ZM13 3V8C13 8.55228 13.4477 9 14 9H19V20C19 20.2652 18.8946 20.5196 18.7071 20.7071C18.5196 20.8946 18.2652 21 18 21H6C5.73478 21 5.48043 20.8946 5.29289 20.7071C5.10536 20.5196 5 20.2652 5 20V4C5 3.73478 5.10536 3.48043 5.29289 3.29289C5.48043 3.10536 5.73478 3 6 3H13ZM12 11C12.5523 11 13 11.4477 13 12V18C13 18.5523 12.5523 19 12 19C11.4477 19 11 18.5523 11 18V12C11 11.4477 11.4477 11 12 11ZM16 14C16.5523 14 17 14.4477 17 15V18C17 18.5523 16.5523 19 16 19C15.4477 19 15 18.5523 15 18V15C15 14.4477 15.4477 14 16 14ZM8 16C8.55228 16 9 16.4477 9 17V18C9 18.5523 8.55228 19 8 19C7.44772 19 7 18.5523 7 18V17C7 16.4477 7.44772 16 8 16Z"
+    fill={color}
+  />
+</svg>
diff --git a/web-common/src/components/icons/ThreeDot.svelte b/web-common/src/components/icons/ThreeDot.svelte
new file mode 100644
index 00000000000..fb6e73db706
--- /dev/null
+++ b/web-common/src/components/icons/ThreeDot.svelte
@@ -0,0 +1,18 @@
+<script lang="ts">
+  export let size = "1em";
+  export let color = "currentColor";
+  export let className = "";
+</script>
+
+<svg
+  height={size}
+  viewBox="0 0 24 24"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+  class={className}
+>
+  <path
+    d="M5.99999 10.0001C4.9 10.0001 4 10.9001 4 12.0001C4 13.1001 4.9 14.0001 5.99999 14.0001C7.09999 14.0001 7.99999 13.1001 7.99999 12.0001C7.99999 10.9001 7.09999 10.0001 5.99999 10.0001ZM18.0001 10.0001C16.9 10.0001 16 10.9001 16 12.0001C16 13.1001 16.9 14.0001 18.0001 14.0001C19.1 14.0001 20 13.1001 20 12.0001C20 10.9001 19.1 10.0001 18.0001 10.0001ZM12 10.0001C10.9 10.0001 10 10.9001 10 12.0001C10 13.1001 10.9 14.0001 12 14.0001C13.1 14.0001 14 13.1001 14 12.0001C14 10.9001 13.1 10.0001 12 10.0001Z"
+    fill={color}
+  />
+</svg>
diff --git a/web-common/src/features/entity-management/resource-selectors.ts b/web-common/src/features/entity-management/resource-selectors.ts
index 400a8cfa459..f140a90fd6d 100644
--- a/web-common/src/features/entity-management/resource-selectors.ts
+++ b/web-common/src/features/entity-management/resource-selectors.ts
@@ -15,6 +15,7 @@ export enum ResourceKind {
   Source = "rill.runtime.v1.Source",
   Model = "rill.runtime.v1.Model",
   MetricsView = "rill.runtime.v1.MetricsView",
+  Report = "rill.runtime.v1.Report",
 }
 export const SingletonProjectParserName = "parser";