diff --git a/apps/web/Components/Admin/Cache/ReloadButton.tsx b/apps/web/Components/Admin/Cache/ReloadButton.tsx new file mode 100644 index 0000000..6ee039a --- /dev/null +++ b/apps/web/Components/Admin/Cache/ReloadButton.tsx @@ -0,0 +1,24 @@ +import { useState } from 'react'; +import { Button } from 'ui/elements'; +import { ReloadOutlined } from 'ui/elements/icons'; + +export function ReloadButton({ onClick }: { readonly onClick: () => Promise }) { + const [pending, setPending] = useState(false); + + return ( + + ); +} diff --git a/apps/web/Components/Admin/Cache/index.tsx b/apps/web/Components/Admin/Cache/index.tsx index e633ece..b90300d 100644 --- a/apps/web/Components/Admin/Cache/index.tsx +++ b/apps/web/Components/Admin/Cache/index.tsx @@ -1,10 +1,10 @@ import Background from '../../Layout/Background'; import { useFilteredQueries } from './lib/hooks'; import { QueryList } from './QueryList'; +import { ReloadButton } from './ReloadButton'; import { min } from '@/styles/mq'; import styled from 'styled-components'; import { Collapse, Divider, Input } from 'ui/elements'; -import { Flex } from 'ui/grid'; const Wrapper = styled(Background)` padding: 4px 6px; @@ -20,8 +20,15 @@ const Wrapper = styled(Background)` } `; +const Flex = styled.div` + display: flex; + margin-bottom: 16px; + justify-content: space-between; + gap: 10px; +`; + export function Cache() { - const { filteredQueries, setFilterString } = useFilteredQueries(); + const { filteredQueries, refetch, setFilterString } = useFilteredQueries(); if (!filteredQueries) { return
Загрузка...
; @@ -30,12 +37,13 @@ export function Cache() { return ( Управление кэшем - + setFilterString(e.target.value)} /> + signal && cacheApi.getQueries({ signal }), queryKey: ['admin', 'cache', 'queries'], @@ -26,5 +26,5 @@ export function useFilteredQueries() { } }, [debouncedFilterString, queries]); - return { filteredQueries, queries, setFilterString }; + return { filteredQueries, queries, refetch, setFilterString }; }