diff --git a/web/src/components/features/layouts/AppVerticalCodeSplitter/DataContainer.tsx b/web/src/components/features/layouts/AppVerticalCodeSplitter/DataContainer.tsx index 03db7c3ae..b05f4ea8a 100644 --- a/web/src/components/features/layouts/AppVerticalCodeSplitter/DataContainer.tsx +++ b/web/src/components/features/layouts/AppVerticalCodeSplitter/DataContainer.tsx @@ -15,7 +15,7 @@ export const DataContainer: React.FC<{ return (
diff --git a/web/src/components/features/list/FavoriteStar.tsx b/web/src/components/features/list/FavoriteStar.tsx index 5b86c5df0..d0f49b4f5 100644 --- a/web/src/components/features/list/FavoriteStar.tsx +++ b/web/src/components/features/list/FavoriteStar.tsx @@ -81,8 +81,6 @@ export const useFavoriteStar = ({ return userFavorites?.some((favorite) => favorite.id === id || favorite.collection_id === id); }, [userFavorites, id]); - console.log('userFavorites', isFavorited, userFavorites); - const onFavoriteClick = useMemoizedFn(async (e?: React.MouseEvent) => { e?.stopPropagation(); e?.preventDefault(); diff --git a/web/src/components/ui/dropdown/DropdownBase.tsx b/web/src/components/ui/dropdown/DropdownBase.tsx index 7373e8592..8f418b403 100644 --- a/web/src/components/ui/dropdown/DropdownBase.tsx +++ b/web/src/components/ui/dropdown/DropdownBase.tsx @@ -28,7 +28,7 @@ const DropdownMenuSubTrigger = React.forwardRef< (({ className, inset, ...props }, ref) => ( )); diff --git a/web/src/components/ui/layouts/AppSplitter/splitterStyles.css b/web/src/components/ui/layouts/AppSplitter/splitterStyles.css index c177b8720..17a8724eb 100644 --- a/web/src/components/ui/layouts/AppSplitter/splitterStyles.css +++ b/web/src/components/ui/layouts/AppSplitter/splitterStyles.css @@ -10,7 +10,7 @@ position: absolute; white-space: normal; width: 100%; - overflow: hidden; + overflow: visible; } .react-split__sash { diff --git a/web/src/components/ui/typography/EditableTitle.tsx b/web/src/components/ui/typography/EditableTitle.tsx index e006f3d5e..7d6a05a31 100644 --- a/web/src/components/ui/typography/EditableTitle.tsx +++ b/web/src/components/ui/typography/EditableTitle.tsx @@ -35,10 +35,12 @@ export const EditableTitle = React.memo( placeholder?: string; style?: React.CSSProperties; inputClassName?: string; + id?: string; } & VariantProps >( ( { + id, style, disabled, className = '', @@ -76,10 +78,11 @@ export const EditableTitle = React.memo( {hasTitleOrDescription ? ( <> - + {title}
diff --git a/web/src/controllers/MetricController/MetricViewResults/MetricViewResultsController.tsx b/web/src/controllers/MetricController/MetricViewResults/MetricViewResultsController.tsx index a41b42d68..11d4e22dc 100644 --- a/web/src/controllers/MetricController/MetricViewResults/MetricViewResultsController.tsx +++ b/web/src/controllers/MetricController/MetricViewResults/MetricViewResultsController.tsx @@ -83,7 +83,6 @@ export const MetricViewResults: React.FC = React.memo(({ metric return (
{ - * console.log('This runs every second'); + * // * }, 1000); * ``` */ diff --git a/web/src/layouts/ChatLayout/FileContainer/FileContainerHeader/MetricContainerHeaderButtons/MetricThreeDotMenu.tsx b/web/src/layouts/ChatLayout/FileContainer/FileContainerHeader/MetricContainerHeaderButtons/MetricThreeDotMenu.tsx index 8cf62a345..da58fbeb2 100644 --- a/web/src/layouts/ChatLayout/FileContainer/FileContainerHeader/MetricContainerHeaderButtons/MetricThreeDotMenu.tsx +++ b/web/src/layouts/ChatLayout/FileContainer/FileContainerHeader/MetricContainerHeaderButtons/MetricThreeDotMenu.tsx @@ -17,7 +17,6 @@ import { Download4, History, SquareCode, - Table, SquareChartPen, Star, ShareRight @@ -43,6 +42,8 @@ import { StatusBadgeIndicator } from '@/components/features/metrics/StatusBadgeI import { useFavoriteStar } from '@/components/features/list/FavoriteStar'; import { downloadElementToImage, exportElementToImage, exportJSONToCSV } from '@/lib/exportUtils'; import { METRIC_CHART_CONTAINER_ID } from '@/controllers/MetricController/MetricViewChart/config'; +import { timeout } from '@/lib'; +import { METRIC_CHART_TITLE_INPUT_ID } from '@/controllers/MetricController/MetricViewChart/MetricViewChartHeader'; export const ThreeDotMenuButton = React.memo(({ metricId }: { metricId: string }) => { const { mutateAsync: deleteMetric, isPending: isDeletingMetric } = useDeleteMetric(); @@ -61,15 +62,11 @@ export const ThreeDotMenuButton = React.memo(({ metricId }: { metricId: string } const downloadPNGMenu = useDownloadPNGSelectMenu({ metricId }); const deleteMetricMenu = useDeleteMetricSelectMenu({ metricId }); const renameMetricMenu = useRenameMetricSelectMenu({ metricId }); + const shareMenu = useShareMenuSelectMenu({ metricId }); const items: DropdownItems = useMemo( () => [ - { - label: 'Share', - value: 'share', - icon: , - items: [] - }, + shareMenu, statusSelectMenu, { type: 'divider' }, dashboardSelectMenu, @@ -87,6 +84,7 @@ export const ThreeDotMenuButton = React.memo(({ metricId }: { metricId: string } deleteMetricMenu ], [ + renameMetricMenu, dashboardSelectMenu, deleteMetricMenu, downloadCSVMenu, @@ -101,7 +99,8 @@ export const ThreeDotMenuButton = React.memo(({ metricId }: { metricId: string } collectionSelectMenu, editChartMenu, resultsViewMenu, - sqlEditorMenu + sqlEditorMenu, + shareMenu ] ); @@ -312,7 +311,7 @@ const useResultsViewSelectMenu = () => { return useMemo( () => ({ label: 'Results view', - value: 'edit-chart', + value: 'results-view', onClick: onClickButton, icon: }), @@ -354,7 +353,7 @@ const useDownloadCSVSelectMenu = ({ metricId }: { metricId: string }) => { const data = metricData?.data; if (data && title) { setIsDownloading(true); - await exportJSONToCSV(data, `${title}.csv`); + await exportJSONToCSV(data, title); setIsDownloading(false); } } @@ -414,6 +413,7 @@ const useDeleteMetricSelectMenu = ({ metricId }: { metricId: string }) => { const useRenameMetricSelectMenu = ({ metricId }: { metricId: string }) => { const { mutateAsync: updateMetric } = useUpdateMetric(); + const onSetFileView = useChatLayoutContextSelector((x) => x.onSetFileView); return useMemo( () => ({ @@ -421,11 +421,29 @@ const useRenameMetricSelectMenu = ({ metricId }: { metricId: string }) => { value: 'rename-metric', icon: , onClick: async () => { - console.log('rename'); - alert('TODO: Implement rename metric'); - // await updateMetric({ id: metricId, title: 'New title' }); + onSetFileView({ fileView: 'chart' }); + await timeout(125); + const input = document.getElementById(METRIC_CHART_TITLE_INPUT_ID) as HTMLInputElement; + if (input) { + input.focus(); + input.select(); + } } }), [metricId] ); }; + +export const useShareMenuSelectMenu = ({ metricId }: { metricId: string }) => { + const { mutateAsync: updateMetric } = useUpdateMetric(); + + return useMemo( + () => ({ + label: 'Share metric', + value: 'share-metric', + icon: , + items: [
SWAG
] + }), + [] + ); +};