* Move shared components to a packages/ directory so they can be publish more sensibly * Iterate towards split out shared-components module * Move shared component source into src/ subdir * Fix up imports * Include shared components in babel-ing (again) * Remove now unused dependencies * Update import in storybook preview * ...except of course they aren't unused if we import the shared components by source * Ignore shared components deps * Add shared-components to i18n paths and upgrade web-i18n to version that supports doing so * Move storybook stuff to shared-components * Seems we don't need this anymore... * Remove unused deps and remove storybook plugin from eslint * Presumably working-directory is only valid on run steps * Ignore dep & run prettier * Prettier on knips.ts * Hopefully run in right dir * Remember how to software write * Okay... how about THIS way? * Oh right, they were git ignored. Sigh. * Add concurrently * Ignore in knip * Better? * Paaaaaaaackageeeeeeees * More packages * Move playwright snapshots * Still need a custom snapshots dir * Add eslint back * Oh, now knip sees them * Fix another import * Don't lint shared-components with everything else Okay, eslint & tsconfig are tied too closely for this to work and running tsc on the shared components will need its deps installing * Maybe lint shared components please? * Not quite * Remove storybook again Re-check if it does work without it * Remove storybook eslint plugin as we're not linting storybook here anymore * Remove this too * We do need it here though
35 lines
1.0 KiB
TypeScript
35 lines
1.0 KiB
TypeScript
/*
|
|
Copyright 2024 New Vector Ltd.
|
|
Copyright 2024 The Matrix.org Foundation C.I.C.
|
|
|
|
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
|
|
Please see LICENSE files in the repository root for full details.
|
|
*/
|
|
|
|
import React, { type ComponentType } from "react";
|
|
import { Text } from "@vector-im/compound-web";
|
|
|
|
import { Flex } from "../../../../packages/shared-components/src/utils/Flex";
|
|
|
|
interface Props {
|
|
Icon: ComponentType<React.SVGAttributes<SVGElement>>;
|
|
title: string;
|
|
description: string;
|
|
}
|
|
|
|
const EmptyState: React.FC<Props> = ({ Icon, title, description }) => {
|
|
return (
|
|
<Flex className="mx_EmptyState" direction="column" gap="var(--cpd-space-4x)" align="center" justify="center">
|
|
<Icon width="32px" height="32px" />
|
|
<Text size="lg" weight="semibold">
|
|
{title}
|
|
</Text>
|
|
<Text size="md" weight="regular">
|
|
{description}
|
|
</Text>
|
|
</Flex>
|
|
);
|
|
};
|
|
|
|
export default EmptyState;
|