diff --git a/components/dashboard/src/components/PendingChangesDropdown.tsx b/components/dashboard/src/components/PendingChangesDropdown.tsx
new file mode 100644
index 00000000000000..655a99d7f58c70
--- /dev/null
+++ b/components/dashboard/src/components/PendingChangesDropdown.tsx
@@ -0,0 +1,43 @@
+/**
+ * Copyright (c) 2021 Gitpod GmbH. All rights reserved.
+ * Licensed under the GNU Affero General Public License (AGPL).
+ * See License-AGPL.txt in the project root for license information.
+ */
+
+import { WorkspaceInstance } from "@gitpod/gitpod-protocol";
+import ContextMenu, { ContextMenuEntry } from "./ContextMenu";
+import CaretDown from "../icons/CaretDown.svg";
+
+export default function PendingChangesDropdown(props: { workspaceInstance?: WorkspaceInstance }) {
+ const repo = props.workspaceInstance?.status?.repo;
+ const headingStyle = 'text-gray-500 text-left';
+ const itemStyle = 'text-gray-400 text-left -mt-5';
+ const menuEntries: ContextMenuEntry[] = [];
+ let totalChanges = 0;
+ if (repo) {
+ if ((repo.totalUntrackedFiles || 0) > 0) {
+ totalChanges += repo.totalUntrackedFiles || 0;
+ menuEntries.push({ title: 'Untracked Files', customFontStyle: headingStyle });
+ (repo.untrackedFiles || []).forEach(item => menuEntries.push({ title: item, customFontStyle: itemStyle }));
+ }
+ if ((repo.totalUncommitedFiles || 0) > 0) {
+ totalChanges += repo.totalUncommitedFiles || 0;
+ menuEntries.push({ title: 'Uncommitted Files', customFontStyle: headingStyle });
+ (repo.uncommitedFiles || []).forEach(item => menuEntries.push({ title: item, customFontStyle: itemStyle }));
+ }
+ if ((repo.totalUnpushedCommits || 0) > 0) {
+ totalChanges += repo.totalUnpushedCommits || 0;
+ menuEntries.push({ title: 'Unpushed Commits', customFontStyle: headingStyle });
+ (repo.unpushedCommits || []).forEach(item => menuEntries.push({ title: item, customFontStyle: itemStyle }));
+ }
+ }
+ if (totalChanges <= 0) {
+ return
No Changes
;
+ }
+ return
+
+ {totalChanges} Change{totalChanges === 1 ? '' : 's'}
+
+
+ ;
+}
\ No newline at end of file
diff --git a/components/dashboard/src/start/StartWorkspace.tsx b/components/dashboard/src/start/StartWorkspace.tsx
index 89e4bbc065ad23..352ae2bb43aeca 100644
--- a/components/dashboard/src/start/StartWorkspace.tsx
+++ b/components/dashboard/src/start/StartWorkspace.tsx
@@ -9,8 +9,7 @@ import React, { useEffect, Suspense } from "react";
import { DisposableCollection, WorkspaceInstance, WorkspaceImageBuild, Workspace, WithPrebuild } from "@gitpod/gitpod-protocol";
import { HeadlessLogEvent } from "@gitpod/gitpod-protocol/lib/headless-workspace-log";
import { ErrorCodes } from "@gitpod/gitpod-protocol/lib/messaging/error";
-import ContextMenu, { ContextMenuEntry } from "../components/ContextMenu";
-import CaretDown from "../icons/CaretDown.svg";
+import PendingChangesDropdown from "../components/PendingChangesDropdown";
import { getGitpodService, gitpodHostUrl } from "../service/service";
import { StartPage, StartPhase, StartWorkspaceError } from "./StartPage";
@@ -274,7 +273,7 @@ export default class StartWorkspace extends React.Component
-
+
{this.state.workspaceInstance.workspaceId}
@@ -296,40 +295,6 @@ export default class StartWorkspace extends React.Component
0) {
- totalChanges += repo.totalUntrackedFiles || 0;
- menuEntries.push({ title: 'Untracked Files', customFontStyle: headingStyle });
- (repo.untrackedFiles || []).forEach(item => menuEntries.push({ title: item, customFontStyle: itemStyle }));
- }
- if ((repo.totalUncommitedFiles || 0) > 0) {
- totalChanges += repo.totalUncommitedFiles || 0;
- menuEntries.push({ title: 'Uncommitted Files', customFontStyle: headingStyle });
- (repo.uncommitedFiles || []).forEach(item => menuEntries.push({ title: item, customFontStyle: itemStyle }));
- }
- if ((repo.totalUnpushedCommits || 0) > 0) {
- totalChanges += repo.totalUnpushedCommits || 0;
- menuEntries.push({ title: 'Unpushed Commits', customFontStyle: headingStyle });
- (repo.unpushedCommits || []).forEach(item => menuEntries.push({ title: item, customFontStyle: itemStyle }));
- }
- }
- if (totalChanges <= 0) {
- return No Changes
;
- }
- return
-
- {totalChanges} Change{totalChanges === 1 ? '' : 's'}
-
-
- ;
-}
-
interface ImageBuildViewProps {
workspaceId: string;
onStartWithDefaultImage: () => void;
diff --git a/components/dashboard/src/workspaces/WorkspaceEntry.tsx b/components/dashboard/src/workspaces/WorkspaceEntry.tsx
index 3b5f1a42848cfe..69fe815a318a3b 100644
--- a/components/dashboard/src/workspaces/WorkspaceEntry.tsx
+++ b/components/dashboard/src/workspaces/WorkspaceEntry.tsx
@@ -9,8 +9,9 @@ import { GitpodHostUrl } from '@gitpod/gitpod-protocol/lib/util/gitpod-host-url'
import ContextMenu, { ContextMenuEntry } from '../components/ContextMenu';
import moment from 'moment';
import Modal from '../components/Modal';
-import { MouseEvent, useState } from 'react';
+import { useState } from 'react';
import { WorkspaceModel } from './workspace-model';
+import PendingChangesDropdown from '../components/PendingChangesDropdown';
import Tooltip from '../components/Tooltip';
function getLabel(state: WorkspaceInstancePhase) {
@@ -26,16 +27,7 @@ interface Props {
export function WorkspaceEntry({ desc, model, isAdmin, stopWorkspace }: Props) {
const [isModalVisible, setModalVisible] = useState(false);
- const [isChangesModalVisible, setChangesModalVisible] = useState(false);
const state: WorkspaceInstancePhase = desc.latestInstance?.status?.phase || 'stopped';
- const pendingChanges = getPendingChanges(desc.latestInstance);
- const numberOfChanges = pendingChanges.reduceRight((i, c) => i + c.items.length, 0)
- let changesLabel = 'No Changes';
- if (numberOfChanges === 1) {
- changesLabel = '1 Change';
- } else if (numberOfChanges > 1) {
- changesLabel = numberOfChanges + ' Changes';
- }
const currentBranch = desc.latestInstance?.status.repo?.branch || Workspace.getBranchName(desc.workspace) || '';
const ws = desc.workspace;
const startUrl = new GitpodHostUrl(window.location.href).with({
@@ -88,10 +80,6 @@ export function WorkspaceEntry({ desc, model, isAdmin, stopWorkspace }: Props) {
);
}
const project = getProject(ws);
- const showChanges = (event: MouseEvent) => {
- event.preventDefault();
- setChangesModalVisible(true);
- }
return
@@ -109,16 +97,9 @@ export function WorkspaceEntry({ desc, model, isAdmin, stopWorkspace }: Props) {
-
0 ? showChanges : undefined}>
-
-
{currentBranch}
- {
- numberOfChanges > 0 ?
-
{changesLabel}
- :
-
No Changes
- }
-
+
@@ -131,9 +112,6 @@ export function WorkspaceEntry({ desc, model, isAdmin, stopWorkspace }: Props) {
-
setChangesModalVisible(false)}>
- {getChangesPopup(pendingChanges)}
-
{isModalVisible &&
setModalVisible(false)}>
Delete Workspace
@@ -155,36 +133,6 @@ export function WorkspaceEntry({ desc, model, isAdmin, stopWorkspace }: Props) {
;
}
-export interface PendingChanges {
- message: string, items: string[]
-}
-
-export function getPendingChanges(wsi?: WorkspaceInstance): PendingChanges[] {
- const pendingChanges: { message: string, items: string[] }[] = [];
- const repo = wsi?.status.repo;
- if (repo) {
- if (repo.totalUncommitedFiles || 0 > 0) {
- pendingChanges.push({
- message: repo.totalUncommitedFiles === 1 ? 'an uncommited file' : `${repo.totalUncommitedFiles} uncommited files`,
- items: repo.uncommitedFiles || []
- });
- }
- if (repo.totalUntrackedFiles || 0 > 0) {
- pendingChanges.push({
- message: repo.totalUntrackedFiles === 1 ? 'an untracked file' : `${repo.totalUntrackedFiles} untracked files`,
- items: repo.untrackedFiles || []
- });
- }
- if (repo.totalUnpushedCommits || 0 > 0) {
- pendingChanges.push({
- message: repo.totalUnpushedCommits === 1 ? 'an unpushed commit' : `${repo.totalUnpushedCommits} unpushed commits`,
- items: repo.unpushedCommits || []
- });
- }
- }
- return pendingChanges;
-}
-
export function getProject(ws: Workspace) {
if (CommitContext.is(ws.context)) {
return `${ws.context.repository.host}/${ws.context.repository.owner}/${ws.context.repository.name}`;
@@ -193,17 +141,6 @@ export function getProject(ws: Workspace) {
}
}
-export function getChangesPopup(changes: PendingChanges[]) {
- return
- {changes.map(c => {
- return
-
{c.message}
- {c.items.map(i =>
{i}
)}
-
;
- })}
-
-}
-
export function WorkspaceStatusIndicator({instance}: {instance?: WorkspaceInstance}) {
const state: WorkspaceInstancePhase = instance?.status?.phase || 'stopped';
let stateClassName = 'rounded-full w-3 h-3 text-sm align-middle';