diff --git a/web/satellite/src/components/common/TableItem.vue b/web/satellite/src/components/common/TableItem.vue
index a138f8393..48f3f2fb2 100644
--- a/web/satellite/src/components/common/TableItem.vue
+++ b/web/satellite/src/components/common/TableItem.vue
@@ -28,6 +28,7 @@
cellContentClicked(index, e)">
+
{{ val }}
diff --git a/web/satellite/src/types/projects.ts b/web/satellite/src/types/projects.ts
index 3d4f570a3..74f3a6a18 100644
--- a/web/satellite/src/types/projects.ts
+++ b/web/satellite/src/types/projects.ts
@@ -248,6 +248,14 @@ export class ProjectInvitation {
public inviterEmail: string,
public createdAt: Date,
) {}
+
+ /**
+ * Returns created date as a local string.
+ */
+ public get invitedDate(): string {
+ const createdAt = new Date(this.createdAt);
+ return createdAt.toLocaleString('en-US', { year: 'numeric', month: '2-digit', day: 'numeric' });
+ }
}
/**
diff --git a/web/satellite/src/views/all-dashboard/components/MyProjects.vue b/web/satellite/src/views/all-dashboard/components/MyProjects.vue
index 640b8bbb5..3af3ea520 100644
--- a/web/satellite/src/views/all-dashboard/components/MyProjects.vue
+++ b/web/satellite/src/views/all-dashboard/components/MyProjects.vue
@@ -32,7 +32,7 @@
-
+
diff --git a/web/satellite/src/views/all-dashboard/components/ProjectTableInvitationItem.vue b/web/satellite/src/views/all-dashboard/components/ProjectTableInvitationItem.vue
new file mode 100644
index 000000000..b43086744
--- /dev/null
+++ b/web/satellite/src/views/all-dashboard/components/ProjectTableInvitationItem.vue
@@ -0,0 +1,209 @@
+// Copyright (C) 2023 Storj Labs, Inc.
+// See LICENSE for copying information.
+
+
+
+
+
+
+
+ |
+
+
+
+
+
+
+
+
diff --git a/web/satellite/src/views/all-dashboard/components/ProjectTableItem.vue b/web/satellite/src/views/all-dashboard/components/ProjectTableItem.vue
index 534c0bd14..fa363d4bb 100644
--- a/web/satellite/src/views/all-dashboard/components/ProjectTableItem.vue
+++ b/web/satellite/src/views/all-dashboard/components/ProjectTableItem.vue
@@ -206,7 +206,8 @@ async function goToProjectEdit(): Promise
{
&__item {
display: flex;
align-items: center;
- padding: 15px 25px;
+ width: 200px;
+ padding: 15px;
color: var(--c-grey-6);
cursor: pointer;
diff --git a/web/satellite/src/views/all-dashboard/components/ProjectsTable.vue b/web/satellite/src/views/all-dashboard/components/ProjectsTable.vue
index cc6f13c7e..aeb8c3947 100644
--- a/web/satellite/src/views/all-dashboard/components/ProjectsTable.vue
+++ b/web/satellite/src/views/all-dashboard/components/ProjectsTable.vue
@@ -3,7 +3,7 @@
@@ -14,6 +14,11 @@
+
import { computed } from 'vue';
-import { Project } from '@/types/projects';
+import { Project, ProjectInvitation } from '@/types/projects';
import { useProjectsStore } from '@/store/modules/projectsStore';
import ProjectTableItem from '@/views/all-dashboard/components/ProjectTableItem.vue';
+import ProjectTableInvitationItem from '@/views/all-dashboard/components/ProjectTableInvitationItem.vue';
import VTable from '@/components/common/VTable.vue';
const projectsStore = useProjectsStore();
+const props = withDefaults(defineProps<{
+ invites?: ProjectInvitation[],
+}>(), {
+ invites: () => [],
+});
+
/**
* Returns projects list from store.
*/