snapshot of https://github.com/RocketChat/Rocket.Chat.git (develop, 2026-09-16; blobs > 131072B omitted)

apps/meteor/client/components/dashboards/PeriodSelector.tsx

@@ -0,0 +1,31 @@
+import { Select } from '@rocket.chat/fuselage';
+import { useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import type { Period } from './periods';
+import { getPeriod } from './periods';
+
+type PeriodSelectorProps<TPeriod extends Period['key']> = {
+	periods: TPeriod[];
+	value: TPeriod;
+	name?: string;
+	onChange: (value: TPeriod) => void;
+};
+
+const PeriodSelector = <TPeriod extends Period['key']>({ periods, value, name, onChange }: PeriodSelectorProps<TPeriod>) => {
+	const { t } = useTranslation();
+
+	const options = useMemo<[string, string][]>(() => periods.map((period) => [period, t(...getPeriod(period).label)]), [periods, t]);
+
+	return (
+		<Select
+			name={name}
+			options={options}
+			value={value}
+			onChange={(value): void => onChange(value as TPeriod)}
+			aria-label={t('Select_period')}
+		/>
+	);
+};
+
+export default PeriodSelector;