8000 refactor(site): Refactor build error warning by BrunoQuaresma · Pull Request #7686 · coder/coder · GitHub
[go: up one dir, main page]

Skip to content

refactor(site): Refactor build error warning #7686

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
May 25, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 17 additions & 4 deletions site/src/components/Alert/Alert.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,18 +3,19 @@ import Collapse from "@mui/material/Collapse"
// eslint-disable-next-line no-restricted-imports -- It is the base component
import MuiAlert, { AlertProps as MuiAlertProps } from "@mui/material/Alert"
import Button from "@mui/material/Button"
import Box from "@mui/material/Box"

export interface AlertProps extends PropsWithChildren {
severity: MuiAlertProps["severity"]
actions?: ReactNode[]
actions?: ReactNode
dismissible?: boolean
onRetry?: () => void
onDismiss?: () => void
}

export const Alert: FC<AlertProps> = ({
children,
actions = [],
actions,
onRetry,
dismissible,
severity,
Expand All @@ -29,8 +30,7 @@ export const Alert: FC<AlertProps> = ({
action={
<>
{/* CTAs passed in by the consumer */}
{actions.length > 0 &&
actions.map((action) => <div key={String(action)}>{action}</div>)}
{actions}

{/* retry CTA */}
{onRetry && (
Expand Down Expand Up @@ -61,3 +61,16 @@ export const Alert: FC<AlertProps> = ({
</Collapse>
)
}

export const AlertDetail = ({ children }: { children: ReactNode }) => {
return (
<Box
component="span"
color={(theme) => theme.palette.text.secondary}
fontSize={13}
data-chromatic="ignore"
>
{children}
</Box>
)
}
12 changes: 2 additions & 10 deletions site/src/components/Alert/ErrorAlert.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import { AlertProps, Alert } from "./Alert"
import { AlertProps, Alert, AlertDetail } from "./Alert"
import AlertTitle from "@mui/material/AlertTitle"
import Box from "@mui/material/Box"
import { getErrorMessage, getErrorDetail } from "api/errors"
import { FC } from "react"

Expand All @@ -15,14 +14,7 @@ export const ErrorAlert: FC<
{detail ? (
<>
<AlertTitle>{message}</AlertTitle>
<Box
component="span"
color={(theme) => theme.palette.text.secondary}
fontSize={13}
data-chromatic="ignore"
>
{detail}
</Box>
<AlertDetail>{detail}</AlertDetail>
</>
) : (
message
Expand Down
47 changes: 19 additions & 28 deletions site/src/components/Workspace/Workspace.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import Button from "@mui/material/Button"
import { makeStyles } from "@mui/styles"
import RefreshOutlined from "@mui/icons-material/RefreshOutlined"
import { Avatar } from "components/Avatar/Avatar"
import { AgentRow } from "components/Resources/AgentRow"
import { WorkspaceBuildLogs } from "components/WorkspaceBuildLogs/WorkspaceBuildLogs"
Expand All @@ -12,7 +11,7 @@ import { FC } from "react"
import { useTranslation } from "react-i18next"
import { useNavigate } from "react-router-dom"
import * as TypesGen from "../../api/typesGenerated"
import { Alert } from "../Alert/Alert"
import { Alert, AlertDetail } from "../Alert/Alert"
import { BuildsTable } from "../BuildsTable/BuildsTable"
import { Margins } from "../Margins/Margins"
import { Resources } from "../Resources/Resources"
Expand All @@ -31,6 +30,7 @@ import { ErrorAlert } from "components/Alert/ErrorAlert"
import { ImpendingDeletionBanner } from "components/WorkspaceDeletion"
import { useLocalStorage } from "hooks"
import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"
import AlertTitle from "@mui/material/AlertTitle"

export enum WorkspaceErrors {
GET_BUILDS_ERROR = "getBuildsError",
Expand Down Expand Up @@ -209,32 +209,23 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({

{failedBuildLogs && (
<Stack>
<Alert severity="error">
<Stack
className={styles.fullWidth}
direction="row"
alignItems="center"
justifyContent="space-between"
>
<Stack spacing={0}>
<span>Workspace build failed</span>
<span className={styles.errorDetails}>
{workspace.latest_build.job.error}
</span>
</Stack>

{canUpdateTemplate && (
<div>
<Button
onClick={handleBuildRetry}
startIcon={<RefreshOutlined />}
size="small"
>
{t("actionButton.retryDebugMode")}
</Button>
</div>
)}
</Stack>
<Alert
severity="error"
actions={
canUpdateTemplate && (
<Button
key={0}
onClick={handleBuildRetry}
variant="text"
size="small"
>
{t("actionButton.retryDebugMode")}
</Button>
)
}
>
<AlertTitle>Workspace build failed</AlertTitle>
<AlertDetail>{workspace.latest_build.job.error}</AlertDetail>
</Alert>
<WorkspaceBuildLogs logs={failedBuildLogs} />
</Stack>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export const WorkspaceDeletedBanner: FC<
)

return (
<Alert severity="warning" actions={[NewWorkspaceButton]}>
<Alert severity="warning" actions={NewWorkspaceButton}>
{t("warningsAndErrors.workspaceDeletedWarning")}
</Alert>
)
Expand Down
4 changes: 2 additions & 2 deletions site/src/i18n/en/common.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@
"stopped": "Stopped",
"deleting": "Deleting",
"deleted": "Deleted",
"canceling": "Canceling action",
"canceled": "Canceled action",
"canceling": "Canceling",
"canceled": "Canceled",
"failed": "Failed",
"pending": "Pending"
},
Expand Down
2 changes: 1 addition & 1 deletion site/src/i18n/en/workspacePage.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
"stopping": "Stopping...",
"deleting": "Deleting...",
"settings": "Settings",
"retryDebugMode": "Try again in debug mode"
"retryDebugMode": "Try in debug mode"
},
"disabledButton": {
"canceling": "Canceling",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ export const GitAuthSettingsPageView = ({
/>

<div className={styles.description}>
<Alert severity="info" actions={[<EnterpriseBadge key="enterprise" />]}>
<Alert severity="info" actions={<EnterpriseBadge key="enterprise" />}>
Integrating with multiple Git providers is an Enterprise feature.
</Alert>
</div>
Expand Down
0