opensource/coder
3
0
Fork 0
mirror of https://github.com/coder/coder.git synced 2026-09-24 15:04:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: Redesign workspaces page (#1450)

Browse Source 
* feat: Improve navbar to be more compact

The navbar was unnecessarily large before, which made
the UI feel a bit bloaty from my perspective.

* Attempt to remove overrides

* Update theme

* Add text field

* Update theme to dark!

* Fix import ordering

* Fix page location

* Fix requested changes

* Add storybook for workspaces page view

* Add empty view

* Add tests for empty view

* Remove templates page

* Fix local port

* Remove templates from nav

* Fix e2e test

* Remove time.ts

* Remove dep

* Add background color to margins

* Merge status checking from workspace page

* Fix requested changes

* Fix workspace status tests
This commit is contained in:
Kyle Carberry
2022-05-16 16:52:54 -05:00
committed by GitHub
parent e925818526
commit 22ec366535
53 changed files with 626 additions and 1743 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/src/components/WorkspacesTable/WorkspacesTable.tsx
-72
View File
@@ -1,72 +0,0 @@
import Box from "@material-ui/core/Box"
import Button from "@material-ui/core/Button"
import Table from "@material-ui/core/Table"
import TableBody from "@material-ui/core/TableBody"
import TableCell from "@material-ui/core/TableCell"
import TableHead from "@material-ui/core/TableHead"
import TableRow from "@material-ui/core/TableRow"
import React from "react"
import { Link } from "react-router-dom"
import * as TypesGen from "../../api/typesGenerated"
import { EmptyState } from "../EmptyState/EmptyState"
import { TableHeaderRow } from "../TableHeaders/TableHeaders"
import { TableLoader } from "../TableLoader/TableLoader"
import { TableTitle } from "../TableTitle/TableTitle"
export const Language = {
title: "Workspaces",
nameLabel: "Name",
emptyMessage: "No workspaces have been created yet",
emptyDescription: "Create a workspace to get started",
ctaAction: "Create workspace",
}
export interface WorkspacesTableProps {
templateInfo?: TypesGen.Template
workspaces?: TypesGen.Workspace[]
onCreateWorkspace: () => void
}
export const WorkspacesTable: React.FC<WorkspacesTableProps> = ({ templateInfo, workspaces, onCreateWorkspace }) => {
const isLoading = !templateInfo || !workspaces
return (
<Table>
<TableHead>
<TableTitle title={Language.title} />
<TableHeaderRow>
<TableCell size="small">{Language.nameLabel}</TableCell>
</TableHeaderRow>
</TableHead>
<TableBody>
{isLoading && <TableLoader />}
{workspaces &&
workspaces.map((w) => (
<TableRow key={w.id}>
<TableCell>
<Link to={`/workspaces/${w.id}`}>{w.name}</Link>
</TableCell>
</TableRow>
))}
{workspaces && workspaces.length === 0 && (
<TableRow>
<TableCell colSpan={999}>
<Box p={4}>
<EmptyState
message={Language.emptyMessage}
description={Language.emptyDescription}
cta={
<Button variant="contained" color="primary" onClick={onCreateWorkspace}>
{Language.ctaAction}
</Button>
}
/>
</Box>
</TableCell>
</TableRow>
)}
</TableBody>
</Table>
)
}