From 2da5acda42185972c163852791388420f7ad33e1 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Fri, 6 Aug 2021 14:26:54 +0000 Subject: [PATCH 01/14] Replace active branches link --- components/dashboard/src/projects/Projects.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index 5e7e97ecd9c839..e970ee63a44f56 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -124,7 +124,19 @@ export default function () {

{toRemoteURL(p.cloneUrl)}

-

__ Active Branches

+
+ + + Branches + + + · + + + Prebuilds + + +
viewAllPrebuilds(p)}> {lastPrebuilds.get(p.id) From 931342d50b7da60a5bd5e94ad496583894fba6c6 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Fri, 6 Aug 2021 15:34:20 +0000 Subject: [PATCH 02/14] Update project card style --- .../dashboard/src/projects/Projects.tsx | 37 +++++++++++-------- 1 file changed, 22 insertions(+), 15 deletions(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index e970ee63a44f56..bf39d9e6245180 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -106,10 +106,10 @@ export default function () {
- {projects.map(p => (
-
-
-
+ {projects.map(p => (
+
+
+
{p.name} @@ -122,9 +122,11 @@ export default function () { }]} />
-

{toRemoteURL(p.cloneUrl)}

+ +

{toRemoteURL(p.cloneUrl)}

+
-
+
Branches @@ -138,15 +140,20 @@ export default function () {
-
viewAllPrebuilds(p)}> +
viewAllPrebuilds(p)}> {lastPrebuilds.get(p.id) - ? (
-
-   -
-
{lastPrebuilds.get(p.id)!.branch}
-
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
-
View All ⟶
+ ? (
+ +
+   +
+
{lastPrebuilds.get(p.id)!.branch}
+ · +
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
+ + +
View All →
+
) : (

No recent prebuilds

@@ -154,7 +161,7 @@ export default function () {
))}
+ className="h-52 border-dashed border-2 border-gray-200 dark:border-gray-800 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-xl focus:bg-gitpod-kumquat-light transition ease-in-out group">
New Project
From a3a1adb0b8786b83631cf1bb307763ec3807e755 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Fri, 6 Aug 2021 15:48:11 +0000 Subject: [PATCH 03/14] Add dark theme colors --- components/dashboard/src/projects/Projects.tsx | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index bf39d9e6245180..08ac7017ad1fd2 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -107,9 +107,9 @@ export default function () {
{projects.map(p => (
-
+
-
+
{p.name} @@ -123,24 +123,24 @@ export default function () {
-

{toRemoteURL(p.cloneUrl)}

+

{toRemoteURL(p.cloneUrl)}

- + Branches · - + Prebuilds
-
viewAllPrebuilds(p)}> +
viewAllPrebuilds(p)}> {lastPrebuilds.get(p.id) ? (
@@ -148,11 +148,11 @@ export default function () {  
{lastPrebuilds.get(p.id)!.branch}
- · -
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
+ · +
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
-
View All →
+
View All →
) : (
From 30cdf2e5aa10a01cf7903b2cb4ca18a535c94390 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Wed, 25 Aug 2021 15:39:52 +0000 Subject: [PATCH 04/14] Add link to prebuilds --- components/dashboard/src/projects/Projects.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index b753faf42270f9..ae825a910b0614 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -76,6 +76,8 @@ export default function () { return true; } + const teamOrUserSlug = !!team ? team.slug : 'projects'; + return <>
{projects.length < 1 && ( @@ -134,7 +136,7 @@ export default function () { · - + Prebuilds From 16a0fa2c64af65b349ef0a6ce2259158b11c8b55 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Wed, 25 Aug 2021 15:41:11 +0000 Subject: [PATCH 05/14] Add link to branches --- components/dashboard/src/projects/Projects.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index ae825a910b0614..a803d470253f7c 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -130,7 +130,7 @@ export default function () {
- + Branches From fe6a285d99e63516235041d969d1722e43725ca3 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Wed, 25 Aug 2021 15:48:54 +0000 Subject: [PATCH 06/14] Add link to latest prebuild --- components/dashboard/src/projects/Projects.tsx | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index a803d470253f7c..7e90b85e18cdb6 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -60,10 +60,6 @@ export default function () { history.push(newProjectUrl); } - const viewAllPrebuilds = (p: Project) => { - history.push(`/${!!team ? team.slug : 'projects'}/${p.name}/prebuilds`); - } - const onRemoveProject = async (p: Project) => { await getGitpodService().server.deleteProject(p.id); await updateProjects(); @@ -142,10 +138,10 @@ export default function () {
-
viewAllPrebuilds(p)}> +
{lastPrebuilds.get(p.id) ? (
- +
 
@@ -153,7 +149,7 @@ export default function () { ·
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
- +
View All →
) From 01fea38b32da75901285ebe7f52eeb9c7e9a288e Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Wed, 25 Aug 2021 15:53:16 +0000 Subject: [PATCH 07/14] Add link to git repository --- components/dashboard/src/projects/Projects.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index 7e90b85e18cdb6..d7b4b9f8864da7 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -120,9 +120,9 @@ export default function () { }]} />
- +

{toRemoteURL(p.cloneUrl)}

- +
From c3ced0e2a2de2253fe991d389694008902326fee Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Wed, 25 Aug 2021 16:16:11 +0000 Subject: [PATCH 08/14] Add latest prebuild status icon Co-authored-by: Jan Keromnes --- .../dashboard/src/projects/Projects.tsx | 25 ++++++++++++++++--- 1 file changed, 21 insertions(+), 4 deletions(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index d7b4b9f8864da7..0be470b200fc47 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -14,9 +14,13 @@ import { useContext, useEffect, useState } from "react"; import { getGitpodService } from "../service/service"; import { getCurrentTeam, TeamsContext } from "../teams/teams-context"; import { ThemeContext } from "../theme-context"; -import { PrebuildInfo, Project } from "@gitpod/gitpod-protocol"; +import { PrebuildInfo, PrebuiltWorkspaceState, Project } from "@gitpod/gitpod-protocol"; import { toRemoteURL } from "./render-utils"; import ContextMenu from "../components/ContextMenu"; +import StatusDone from "../icons/StatusDone.svg"; +import StatusPaused from "../icons/StatusPaused.svg"; +import StatusRunning from "../icons/StatusRunning.svg"; +import StatusFailed from "../icons/StatusFailed.svg"; export default function () { const location = useLocation(); @@ -74,6 +78,21 @@ export default function () { const teamOrUserSlug = !!team ? team.slug : 'projects'; + const getPrebuildStatusIcon = (status: PrebuiltWorkspaceState) => { + switch (status) { + case undefined: // Fall through + case "queued": + return StatusPaused; + case "building": + return StatusRunning; + case "aborted": // Fall through + case "timeout": + return StatusFailed; + case "available": + return StatusDone; + } + } + return <>
{projects.length < 1 && ( @@ -142,9 +161,7 @@ export default function () { {lastPrebuilds.get(p.id) ? (
-
-   -
+
{lastPrebuilds.get(p.id)!.branch}
·
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
From c79b5c537881a3b00327ce8dbef4e51fdfb45e60 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Wed, 25 Aug 2021 16:25:34 +0000 Subject: [PATCH 09/14] Truncate the branch name on the project card --- components/dashboard/src/projects/Projects.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index 0be470b200fc47..685bfffd5c89b8 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -162,7 +162,7 @@ export default function () { ? (
-
{lastPrebuilds.get(p.id)!.branch}
+
{lastPrebuilds.get(p.id)!.branch}
·
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
From 7c6f81c600c50fda2c6535ae9bafa3bf815b9ae2 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Wed, 25 Aug 2021 16:40:09 +0000 Subject: [PATCH 10/14] Change branch name width --- components/dashboard/src/projects/Projects.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index 685bfffd5c89b8..c1f296fe485f28 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -162,7 +162,7 @@ export default function () { ? (
-
{lastPrebuilds.get(p.id)!.branch}
+
{lastPrebuilds.get(p.id)!.branch}
·
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
From 25a488058f1d055c7bee2618b59deee6d06dadff Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Wed, 25 Aug 2021 17:05:51 +0000 Subject: [PATCH 11/14] Change color for branch name and timestamp --- components/dashboard/src/projects/Projects.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index c1f296fe485f28..abb367b695d9bb 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -162,9 +162,9 @@ export default function () { ? (
-
{lastPrebuilds.get(p.id)!.branch}
+
{lastPrebuilds.get(p.id)!.branch}
· -
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
+
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
View All →
From c14edd3df7d3bc28f47eadc13cd6e40bc4269074 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Fri, 27 Aug 2021 12:31:39 +0000 Subject: [PATCH 12/14] Change latest prebuild status icon size --- components/dashboard/src/projects/Projects.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index abb367b695d9bb..80606a576f6e99 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -161,7 +161,7 @@ export default function () { {lastPrebuilds.get(p.id) ? (
- +
{lastPrebuilds.get(p.id)!.branch}
·
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
From be099b9a05d4f7a586965237b07c2d76c36cbf9a Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Fri, 27 Aug 2021 12:39:15 +0000 Subject: [PATCH 13/14] Change dot separator color for light theme on project card --- components/dashboard/src/projects/Projects.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index 80606a576f6e99..c5fde0d4153abf 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -163,7 +163,7 @@ export default function () {
{lastPrebuilds.get(p.id)!.branch}
- · + ·
{moment(lastPrebuilds.get(p.id)!.startedAt, "YYYYMMDD").fromNow()}
From 522c30e6a17e7f65b6a4c8cd9823fab6454385ee Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Fri, 27 Aug 2021 12:42:35 +0000 Subject: [PATCH 14/14] Change new project card colors --- components/dashboard/src/projects/Projects.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx index c5fde0d4153abf..1839f86837c3ef 100644 --- a/components/dashboard/src/projects/Projects.tsx +++ b/components/dashboard/src/projects/Projects.tsx @@ -177,10 +177,10 @@ export default function () {
))} {!searchFilter && (
+ className="h-52 border-dashed border-2 border-gray-100 dark:border-gray-800 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-xl focus:bg-gitpod-kumquat-light transition ease-in-out group">
-
New Project
+
New Project