diff --git a/src/components/DataDisplay/PropertyLabels/FeatureLabel.tsx b/src/components/DataDisplay/PropertyLabels/FeatureLabel.tsx new file mode 100644 index 0000000..da0e36b --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/FeatureLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const FeatureLabel: FC> = ( + props, +) => ; diff --git a/src/components/DataDisplay/PropertyLabels/FeaturesLabel.tsx b/src/components/DataDisplay/PropertyLabels/FeaturesLabel.tsx new file mode 100644 index 0000000..5a584b6 --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/FeaturesLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const FeaturesLabel: FC> = ( + props, +) => ; diff --git a/src/components/DataDisplay/PropertyLabels/LastTrainingDurationLabel.tsx b/src/components/DataDisplay/PropertyLabels/LastTrainingDurationLabel.tsx new file mode 100644 index 0000000..674ca49 --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/LastTrainingDurationLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const LastTrainingDurationLabel: FC< + Omit +> = (props) => ; diff --git a/src/components/DataDisplay/PropertyLabels/LastTrainingEndedLabel.tsx b/src/components/DataDisplay/PropertyLabels/LastTrainingEndedLabel.tsx new file mode 100644 index 0000000..0a36922 --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/LastTrainingEndedLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const LastTrainingEndedLabel: FC< + Omit +> = (props) => ; diff --git a/src/components/DataDisplay/PropertyLabels/LastTrainingStartedLabel.tsx b/src/components/DataDisplay/PropertyLabels/LastTrainingStartedLabel.tsx new file mode 100644 index 0000000..2b78d1e --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/LastTrainingStartedLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const LastTrainingStartedLabel: FC< + Omit +> = (props) => ; diff --git a/src/components/DataDisplay/PropertyLabels/NumberOfCasesLabel.tsx b/src/components/DataDisplay/PropertyLabels/NumberOfCasesLabel.tsx new file mode 100644 index 0000000..6aa143a --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/NumberOfCasesLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const NumberOfCasesLabel: FC> = ( + props, +) => ; diff --git a/src/components/DataDisplay/PropertyLabels/NumberOfFeaturesLabel.tsx b/src/components/DataDisplay/PropertyLabels/NumberOfFeaturesLabel.tsx new file mode 100644 index 0000000..7ede20e --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/NumberOfFeaturesLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const NumberOfFeaturesLabel: FC> = ( + props, +) => ; diff --git a/src/components/DataDisplay/PropertyLabels/PropertyLabel.tsx b/src/components/DataDisplay/PropertyLabels/PropertyLabel.tsx new file mode 100644 index 0000000..a3a44f1 --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/PropertyLabel.tsx @@ -0,0 +1,15 @@ +import { ComponentProps, FC } from "react"; +import { useTranslation } from "react-i18next"; +import { EnginePropertyLabelsI18nBundle as i18n } from "./i18n"; + +export type PropertyLabelProps = ComponentProps<"span"> & { + property: keyof typeof i18n.strings; +}; +export const PropertyLabel: FC = ({ + property, + ...props +}) => { + const { t } = useTranslation(i18n.namespace); + + return {t(i18n.strings[property])}; +}; diff --git a/src/components/DataDisplay/PropertyLabels/SourceLabel.tsx b/src/components/DataDisplay/PropertyLabels/SourceLabel.tsx new file mode 100644 index 0000000..2cf36d5 --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/SourceLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const SourceLabel: FC> = ( + props, +) => ; diff --git a/src/components/DataDisplay/PropertyLabels/SourceTypeLabel.tsx b/src/components/DataDisplay/PropertyLabels/SourceTypeLabel.tsx new file mode 100644 index 0000000..921e794 --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/SourceTypeLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const SourceTypeLabel: FC> = ( + props, +) => ; diff --git a/src/components/DataDisplay/PropertyLabels/TimeSeriesLabel.tsx b/src/components/DataDisplay/PropertyLabels/TimeSeriesLabel.tsx new file mode 100644 index 0000000..e31191f --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/TimeSeriesLabel.tsx @@ -0,0 +1,6 @@ +import type { FC } from "react"; +import { PropertyLabel, type PropertyLabelProps } from "./PropertyLabel"; + +export const TimeSeriesLabel: FC> = ( + props, +) => ; diff --git a/src/components/DataDisplay/PropertyLabels/i18n.ts b/src/components/DataDisplay/PropertyLabels/i18n.ts new file mode 100644 index 0000000..a11f07b --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/i18n.ts @@ -0,0 +1,28 @@ +import { + getStringsForI18nBundleFromResource, + I18nBundle, +} from "@howso/ui-internationalization-utils"; +import { Languages } from "../../../constants"; + +const namespace = "EnginePropertyLabels"; + +const en = { + feature: "Feature", + features: "Features", + lastTrainingStarted: "Last trained started", + lastTrainingEnded: "Last training end", + lastTrainingDuration: "Last training duration", + numberOfFeatures: "Number of features", + numberOfCases: "Number of cases", + sourceType: "Source type", + source: "Source", + timeSeries: "Time series", +}; + +type Resource = typeof en; + +export const EnginePropertyLabelsI18nBundle: I18nBundle = { + namespace, + resources: { en }, + strings: getStringsForI18nBundleFromResource(en), +}; diff --git a/src/components/DataDisplay/PropertyLabels/index.stories.tsx b/src/components/DataDisplay/PropertyLabels/index.stories.tsx new file mode 100644 index 0000000..30d8234 --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/index.stories.tsx @@ -0,0 +1,53 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { + FeatureLabel, + FeaturesLabel, + LastTrainingDurationLabel, + LastTrainingEndedLabel, + LastTrainingStartedLabel, + NumberOfCasesLabel, + NumberOfFeaturesLabel, + PropertyLabelProps, + SourceLabel, + SourceTypeLabel, + TimeSeriesLabel, +} from "."; + +// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export +const meta: Meta = { + title: "Components/DataDisplay/PropertyLabels", + // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/7.0/react/writing-docs/docs-page + // tags: ["autodocs"], + parameters: { + // More on Story layout: https://storybook.js.org/docs/react/configure/story-layout + layout: "centered", + }, + // More on argTypes: https://storybook.js.org/docs/react/api/argtypes + argTypes: {}, + args: { + className: "", + }, +}; + +export default meta; +type Story = StoryObj; + +// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args +export const Default: Story = { + // More on args: https://storybook.js.org/docs/react/writing-stories/args + args: {}, + render: (args) => ( +
+ + + + + + + + + + +
+ ), +}; diff --git a/src/components/DataDisplay/PropertyLabels/index.ts b/src/components/DataDisplay/PropertyLabels/index.ts new file mode 100644 index 0000000..1c87f9c --- /dev/null +++ b/src/components/DataDisplay/PropertyLabels/index.ts @@ -0,0 +1,12 @@ +export * from ".//LastTrainingDurationLabel"; +export * from "./FeatureLabel"; +export * from "./FeaturesLabel"; +export * from "./i18n"; +export * from "./LastTrainingEndedLabel"; +export * from "./LastTrainingStartedLabel"; +export * from "./NumberOfCasesLabel"; +export * from "./NumberOfFeaturesLabel"; +export * from "./PropertyLabel"; +export * from "./SourceLabel"; +export * from "./SourceTypeLabel"; +export * from "./TimeSeriesLabel"; diff --git a/src/components/DataDisplay/index.ts b/src/components/DataDisplay/index.ts new file mode 100644 index 0000000..e5b11f3 --- /dev/null +++ b/src/components/DataDisplay/index.ts @@ -0,0 +1,9 @@ +import { Languages } from "@howso/react-tailwind-flowbite-components"; +import { I18nBundle } from "@howso/ui-internationalization-utils"; +import { EnginePropertyLabelsI18nBundle } from "./PropertyLabels"; + +export * from "./PropertyLabels"; + +export const DataDisplayI18nBundles: I18nBundle[] = [ + EnginePropertyLabelsI18nBundle, +]; diff --git a/src/components/Icons/InsightsIcon.tsx b/src/components/Icons/InsightsIcon.tsx new file mode 100644 index 0000000..837740f --- /dev/null +++ b/src/components/Icons/InsightsIcon.tsx @@ -0,0 +1,7 @@ +import type { FC } from "react"; +import { type IconBaseProps } from "react-icons"; +import { HiLightBulb } from "react-icons/hi"; + +export const InsightsIcon: FC = (props) => ( + +); diff --git a/src/components/Icons/SynthesisIcon.tsx b/src/components/Icons/SynthesisIcon.tsx new file mode 100644 index 0000000..9d573c4 --- /dev/null +++ b/src/components/Icons/SynthesisIcon.tsx @@ -0,0 +1,7 @@ +import type { FC } from "react"; +import { type IconBaseProps } from "react-icons"; +import { HiDocumentDuplicate } from "react-icons/hi"; + +export const SynthesisIcon: FC = (props) => ( + +); diff --git a/src/components/Icons/icons.stories.tsx b/src/components/Icons/icons.stories.tsx index 5ca8baa..d2ddf72 100644 --- a/src/components/Icons/icons.stories.tsx +++ b/src/components/Icons/icons.stories.tsx @@ -2,8 +2,10 @@ import type { Meta, StoryObj } from "@storybook/react"; import { FC, ReactNode } from "react"; import { IconBaseProps } from "react-icons"; import { + InsightsIcon, MapDependentFeatureAttributesIcon, ProjectsIcon, + SynthesisIcon, TraineeDefineIcon, TraineeIcon, TraineeLoadIcon, @@ -26,28 +28,27 @@ const meta: Meta = {
} /> } /> } /> } />
- } - /> - } /> + } /> + } /> + } /> + } />
), diff --git a/src/components/Icons/index.ts b/src/components/Icons/index.ts index 37743d2..04b43d9 100644 --- a/src/components/Icons/index.ts +++ b/src/components/Icons/index.ts @@ -1,5 +1,7 @@ +export * from "./InsightsIcon"; export * from "./MapDependentFeatureAttributesIcon"; export * from "./ProjectsIcon"; +export * from "./SynthesisIcon"; export * from "./TraineeDefineIcon"; export * from "./TraineeIcon"; export * from "./TraineeLoadIcon"; diff --git a/src/components/index.ts b/src/components/index.ts index 929f200..ef183e4 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -1,3 +1,4 @@ +export * from "./DataDisplay"; export * from "./FeatureAttributes"; export * from "./Icons"; export * from "./Trainee"; diff --git a/src/index.ts b/src/index.ts index 43b0bdc..03bbccf 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,5 @@ import { I18nBundle } from "@howso/ui-internationalization-utils"; -import { TraineeI18nBundles } from "./components"; +import { DataDisplayI18nBundles, TraineeI18nBundles } from "./components"; import { FeatureAttributesI18nBundles } from "./components/FeatureAttributes"; import { Languages } from "./constants"; @@ -9,6 +9,7 @@ export * from "./hooks"; export * from "./utils"; export const I18nBundles: I18nBundle[] = [ + ...DataDisplayI18nBundles, ...FeatureAttributesI18nBundles, ...TraineeI18nBundles, ];