fix labels for saved queries

src/components/Header/RefreshNow.tsx

@@ -14,7 +14,7 @@ const RefreshNow: FC = () => {
 	const onRefresh = useCallback(() => {
 		setLogsStore((store) => getCleanStoreForRefetch(store));
 	}, []);
-	return <IconButton size={38} renderIcon={renderRefreshIcon} onClick={onRefresh} tooltipLabel="Refresh Now" />;
+	return <IconButton size={38} renderIcon={renderRefreshIcon} onClick={onRefresh} tooltipLabel="Refresh now" />;
 };
 
 export default RefreshNow;

src/pages/Stream/components/PrimaryToolbar.tsx

@@ -1,6 +1,6 @@
-import { Stack, px } from '@mantine/core';
+import { Button, Stack, px } from '@mantine/core';
 import IconButton from '@/components/Button/IconButton';
-import { IconListSearch, IconMaximize, IconTrash } from '@tabler/icons-react';
+import { IconFilterHeart, IconMaximize, IconTrash } from '@tabler/icons-react';
 import { STREAM_PRIMARY_TOOLBAR_CONTAINER_HEIGHT, STREAM_PRIMARY_TOOLBAR_HEIGHT } from '@/constants/theme';
 import TimeRange from '@/components/Header/TimeRange';
 import RefreshInterval from '@/components/Header/RefreshInterval';
@@ -15,23 +15,29 @@ import _ from 'lodash';
 import StreamingButton from '@/components/Header/StreamingButton';
 import { useLogsStore, logsStoreReducers } from '../providers/LogsProvider';
 import { filterStoreReducers, useFilterStore } from '../providers/FilterProvider';
+import classes from '../../../components/Header/styles/LogQuery.module.css';
 
 const { toggleDeleteModal } = logsStoreReducers;
 const { toggleSavedFiltersModal } = filterStoreReducers;
 const renderMaximizeIcon = () => <IconMaximize size={px('1rem')} stroke={1.5} />;
 const renderDeleteIcon = () => <IconTrash size={px('1rem')} stroke={1.5} />;
-const renderSavedFiltersIcon = () => <IconListSearch size={px('1rem')} stroke={1.5} />;
 
 const MaximizeButton = () => {
 	const [_appStore, setAppStore] = useAppStore((_store) => null);
 	const onClick = useCallback(() => setAppStore(appStoreReducers.toggleMaximize), []);
-	return <IconButton renderIcon={renderMaximizeIcon} size={38} onClick={onClick} tooltipLabel="Full Screen" />;
+	return <IconButton renderIcon={renderMaximizeIcon} size={38} onClick={onClick} tooltipLabel="Full screen" />;
 };
 
 const SavedFiltersButton = () => {
 	const [_store, setLogsStore] = useFilterStore((_store) => null);
-	const onClick = useCallback(() => setLogsStore((store) => toggleSavedFiltersModal(store, true)), []);
-	return <IconButton renderIcon={renderSavedFiltersIcon} size={38} onClick={onClick} tooltipLabel="Saved Filters" />;
+	const { intervalbtn } = classes;
+	return (
+		<Button 
+			className={intervalbtn} h="100%" 
+			leftSection={<IconFilterHeart size={px('1rem')} stroke={1.5} />} 
+			onClick={useCallback(() => setLogsStore((store) => toggleSavedFiltersModal(store, true)), [])}>
+			Saved Filters
+		</Button>);
 };
 
 const DeleteStreamButton = () => {

src/pages/Stream/components/Querier/index.tsx

@@ -1,4 +1,4 @@
-import { Group, Menu, Modal, Stack, px } from '@mantine/core';
+import { Group, Menu, Modal, Stack, px, Tooltip } from '@mantine/core';
 import { IconChevronDown, IconCodeCircle, IconFilter, IconFilterEdit, IconFilterPlus } from '@tabler/icons-react';
 import classes from '../../styles/Querier.module.css';
 import { Text } from '@mantine/core';
@@ -227,9 +227,13 @@ const Querier = () => {
 					}}
 					onClick={openSaveFiltersModal}>
 					{custQuerySearchState.savedFilterId ? (
-						<IconFilterEdit size="1rem" stroke={1.2} />
+						<Tooltip label="Edit this filter">
+							<IconFilterEdit size="1rem" stroke={1.2} />
+						</Tooltip>
 					) : (
-						<IconFilterPlus size="1rem" stroke={1.2} />
+						<Tooltip label="Save this filter">
+							<IconFilterPlus size="1rem" stroke={1.2} />
+						</Tooltip>
 					)}
 				</Stack>
 			)}