chore: match templates search error with workspace search error (#14479)

* chore: make templates search error the same as workspaces
This commit is contained in:
Steven Masley
2024-08-30 15:14:59 -05:00
committed by GitHub
parent 0f8251be41
commit 0ef85147cd
3 changed files with 63 additions and 38 deletions

View File

@ -16,9 +16,13 @@ import type { FC } from "react";
interface TemplatesFilterProps { interface TemplatesFilterProps {
filter: ReturnType<typeof useFilter>; filter: ReturnType<typeof useFilter>;
error?: unknown;
} }
export const TemplatesFilter: FC<TemplatesFilterProps> = ({ filter }) => { export const TemplatesFilter: FC<TemplatesFilterProps> = ({
filter,
error,
}) => {
const organizationMenu = useFilterMenu({ const organizationMenu = useFilterMenu({
onChange: (option) => onChange: (option) =>
filter.update({ ...filter.values, organization: option?.value }), filter.update({ ...filter.values, organization: option?.value }),
@ -48,6 +52,7 @@ export const TemplatesFilter: FC<TemplatesFilterProps> = ({ filter }) => {
// learnMoreLink={docs("/templates#template-filtering")} // learnMoreLink={docs("/templates#template-filtering")}
isLoading={false} isLoading={false}
filter={filter} filter={filter}
error={error}
options={ options={
<> <>
<SelectFilter <SelectFilter

View File

@ -112,3 +112,22 @@ export const WithError: Story = {
canCreateTemplates: false, canCreateTemplates: false,
}, },
}; };
export const WithValidationError: Story = {
args: {
error: mockApiError({
message: "Something went wrong fetching templates.",
detail:
"This is a more detailed error message that should help you understand what went wrong.",
validations: [
{
field: "search",
detail: "That search query was invalid, why did you do that?",
},
],
}),
templates: undefined,
examples: undefined,
canCreateTemplates: false,
},
};

View File

@ -9,6 +9,7 @@ import TableCell from "@mui/material/TableCell";
import TableContainer from "@mui/material/TableContainer"; import TableContainer from "@mui/material/TableContainer";
import TableHead from "@mui/material/TableHead"; import TableHead from "@mui/material/TableHead";
import TableRow from "@mui/material/TableRow"; import TableRow from "@mui/material/TableRow";
import { hasError, isApiValidationError } from "api/errors";
import type { Template, TemplateExample } from "api/typesGenerated"; import type { Template, TemplateExample } from "api/typesGenerated";
import { ErrorAlert } from "components/Alert/ErrorAlert"; import { ErrorAlert } from "components/Alert/ErrorAlert";
import { ExternalAvatar } from "components/Avatar/Avatar"; import { ExternalAvatar } from "components/Avatar/Avatar";
@ -228,11 +229,12 @@ export const TemplatesPageView: FC<TemplatesPageViewProps> = ({
</PageHeaderSubtitle> </PageHeaderSubtitle>
</PageHeader> </PageHeader>
<TemplatesFilter filter={filter} /> <TemplatesFilter filter={filter} error={error} />
{/* Validation errors are shown on the filter, other errors are an alert box. */}
{error ? ( {hasError(error) && !isApiValidationError(error) && (
<ErrorAlert error={error} /> <ErrorAlert error={error} />
) : ( )}
<TableContainer> <TableContainer>
<Table> <Table>
<TableHead> <TableHead>
@ -266,7 +268,6 @@ export const TemplatesPageView: FC<TemplatesPageViewProps> = ({
</TableBody> </TableBody>
</Table> </Table>
</TableContainer> </TableContainer>
)}
</Margins> </Margins>
); );
}; };