mirrors/traefik
1
0
Fork 0
mirror of https://github.com/traefik/traefik.git synced 2025-12-08 19:11:56 +01:00
Code Issues Projects Releases Wiki Activity

Fix blocked navigation on Safari

Browse Source
This commit is contained in:
Gina A. 2025-11-12 10:20:16 +01:00 committed by GitHub
parent f45317c9c9
commit 77b1282570
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 29 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
webui/src/layout/EmptyPlaceholder.tsx
View File

@ -1,9 +1,20 @@
import { Flex, Text } from '@traefiklabs/faency' import { AriaTd, Flex, Text } from '@traefiklabs/faency'
import { FiAlertTriangle } from 'react-icons/fi' import { FiAlertTriangle } from 'react-icons/fi'
export const EmptyPlaceholder = ({ message = 'No data available' }: { message?: string }) => ( type EmptyPlaceholderProps = {
message?: string
}
export const EmptyPlaceholder = ({ message = 'No data available' }: EmptyPlaceholderProps) => (
<Flex align="center" justify="center" css={{ py: '$5', color: '$primary' }}> <Flex align="center" justify="center" css={{ py: '$5', color: '$primary' }}>
<FiAlertTriangle size={16} /> <FiAlertTriangle size={16} />
<Text css={{ pl: '$2' }}>{message}</Text> <Text css={{ pl: '$2' }}>{message}</Text>
</Flex> </Flex>
) )
export const EmptyPlaceholderTd = (props: EmptyPlaceholderProps) => {
return (
<AriaTd css={{ pointerEvents: 'none' }} fullColSpan>
<EmptyPlaceholder {...props} />
</AriaTd>
)
}

6
webui/src/pages/http/HttpMiddlewares.tsx
View File

@ -14,7 +14,7 @@ import SortableTh from 'components/tables/SortableTh'
import Tooltip from 'components/Tooltip' import Tooltip from 'components/Tooltip'
import TooltipText from 'components/TooltipText' import TooltipText from 'components/TooltipText'
import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination' import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination'
import { EmptyPlaceholder } from 'layout/EmptyPlaceholder' import { EmptyPlaceholderTd } from 'layout/EmptyPlaceholder'
import { parseMiddlewareType } from 'libs/parsers' import { parseMiddlewareType } from 'libs/parsers'
export const makeRowRender = (): RenderRowType => { export const makeRowRender = (): RenderRowType => {
@ -79,9 +79,7 @@ export const HttpMiddlewaresRender = ({
{(isEmpty || !!error) && ( {(isEmpty || !!error) && (
<AriaTfoot> <AriaTfoot>
<AriaTr> <AriaTr>
<AriaTd fullColSpan> <EmptyPlaceholderTd message={error ? 'Failed to fetch data' : 'No data available'} />
<EmptyPlaceholder message={error ? 'Failed to fetch data' : 'No data available'} />
</AriaTd>
</AriaTr> </AriaTr>
</AriaTfoot> </AriaTfoot>
)} )}

6
webui/src/pages/http/HttpRouters.tsx
View File

@ -16,7 +16,7 @@ import SortableTh from 'components/tables/SortableTh'
import Tooltip from 'components/Tooltip' import Tooltip from 'components/Tooltip'
import TooltipText from 'components/TooltipText' import TooltipText from 'components/TooltipText'
import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination' import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination'
import { EmptyPlaceholder } from 'layout/EmptyPlaceholder' import { EmptyPlaceholderTd } from 'layout/EmptyPlaceholder'
export const makeRowRender = (protocol = 'http'): RenderRowType => { export const makeRowRender = (protocol = 'http'): RenderRowType => {
const HttpRoutersRenderRow = (row) => ( const HttpRoutersRenderRow = (row) => (
@ -100,9 +100,7 @@ export const HttpRoutersRender = ({
{(isEmpty || !!error) && ( {(isEmpty || !!error) && (
<AriaTfoot> <AriaTfoot>
<AriaTr> <AriaTr>
<AriaTd fullColSpan> <EmptyPlaceholderTd message={error ? 'Failed to fetch data' : 'No data available'} />
<EmptyPlaceholder message={error ? 'Failed to fetch data' : 'No data available'} />
</AriaTd>
</AriaTr> </AriaTr>
</AriaTfoot> </AriaTfoot>
)} )}

6
webui/src/pages/http/HttpServices.tsx
View File

@ -14,7 +14,7 @@ import SortableTh from 'components/tables/SortableTh'
import Tooltip from 'components/Tooltip' import Tooltip from 'components/Tooltip'
import TooltipText from 'components/TooltipText' import TooltipText from 'components/TooltipText'
import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination' import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination'
import { EmptyPlaceholder } from 'layout/EmptyPlaceholder' import { EmptyPlaceholderTd } from 'layout/EmptyPlaceholder'
export const makeRowRender = (): RenderRowType => { export const makeRowRender = (): RenderRowType => {
const HttpServicesRenderRow = (row) => ( const HttpServicesRenderRow = (row) => (
@ -78,9 +78,7 @@ export const HttpServicesRender = ({
{(isEmpty || !!error) && ( {(isEmpty || !!error) && (
<AriaTfoot> <AriaTfoot>
<AriaTr> <AriaTr>
<AriaTd fullColSpan> <EmptyPlaceholderTd message={error ? 'Failed to fetch data' : 'No data available'} />
<EmptyPlaceholder message={error ? 'Failed to fetch data' : 'No data available'} />
</AriaTd>
</AriaTr> </AriaTr>
</AriaTfoot> </AriaTfoot>
)} )}

6
webui/src/pages/tcp/TcpMiddlewares.tsx
View File

@ -14,7 +14,7 @@ import SortableTh from 'components/tables/SortableTh'
import Tooltip from 'components/Tooltip' import Tooltip from 'components/Tooltip'
import TooltipText from 'components/TooltipText' import TooltipText from 'components/TooltipText'
import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination' import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination'
import { EmptyPlaceholder } from 'layout/EmptyPlaceholder' import { EmptyPlaceholderTd } from 'layout/EmptyPlaceholder'
import { parseMiddlewareType } from 'libs/parsers' import { parseMiddlewareType } from 'libs/parsers'
export const makeRowRender = (): RenderRowType => { export const makeRowRender = (): RenderRowType => {
@ -79,9 +79,7 @@ export const TcpMiddlewaresRender = ({
{(isEmpty || !!error) && ( {(isEmpty || !!error) && (
<AriaTfoot> <AriaTfoot>
<AriaTr> <AriaTr>
<AriaTd fullColSpan> <EmptyPlaceholderTd message={error ? 'Failed to fetch data' : 'No data available'} />
<EmptyPlaceholder message={error ? 'Failed to fetch data' : 'No data available'} />
</AriaTd>
</AriaTr> </AriaTr>
</AriaTfoot> </AriaTfoot>
)} )}

6
webui/src/pages/tcp/TcpRouters.tsx
View File

@ -16,7 +16,7 @@ import SortableTh from 'components/tables/SortableTh'
import Tooltip from 'components/Tooltip' import Tooltip from 'components/Tooltip'
import TooltipText from 'components/TooltipText' import TooltipText from 'components/TooltipText'
import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination' import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination'
import { EmptyPlaceholder } from 'layout/EmptyPlaceholder' import { EmptyPlaceholderTd } from 'layout/EmptyPlaceholder'
export const makeRowRender = (): RenderRowType => { export const makeRowRender = (): RenderRowType => {
const TcpRoutersRenderRow = (row) => ( const TcpRoutersRenderRow = (row) => (
@ -96,9 +96,7 @@ export const TcpRoutersRender = ({
{(isEmpty || !!error) && ( {(isEmpty || !!error) && (
<AriaTfoot> <AriaTfoot>
<AriaTr> <AriaTr>
<AriaTd fullColSpan> <EmptyPlaceholderTd message={error ? 'Failed to fetch data' : 'No data available'} />
<EmptyPlaceholder message={error ? 'Failed to fetch data' : 'No data available'} />
</AriaTd>
</AriaTr> </AriaTr>
</AriaTfoot> </AriaTfoot>
)} )}

6
webui/src/pages/tcp/TcpServices.tsx
View File

@ -14,7 +14,7 @@ import SortableTh from 'components/tables/SortableTh'
import Tooltip from 'components/Tooltip' import Tooltip from 'components/Tooltip'
import TooltipText from 'components/TooltipText' import TooltipText from 'components/TooltipText'
import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination' import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination'
import { EmptyPlaceholder } from 'layout/EmptyPlaceholder' import { EmptyPlaceholderTd } from 'layout/EmptyPlaceholder'
export const makeRowRender = (): RenderRowType => { export const makeRowRender = (): RenderRowType => {
const TcpServicesRenderRow = (row) => ( const TcpServicesRenderRow = (row) => (
@ -78,9 +78,7 @@ export const TcpServicesRender = ({
{(isEmpty || !!error) && ( {(isEmpty || !!error) && (
<AriaTfoot> <AriaTfoot>
<AriaTr> <AriaTr>
<AriaTd fullColSpan> <EmptyPlaceholderTd message={error ? 'Failed to fetch data' : 'No data available'} />
<EmptyPlaceholder message={error ? 'Failed to fetch data' : 'No data available'} />
</AriaTd>
</AriaTr> </AriaTr>
</AriaTfoot> </AriaTfoot>
)} )}

6
webui/src/pages/udp/UdpRouters.tsx
View File

@ -15,7 +15,7 @@ import SortableTh from 'components/tables/SortableTh'
import Tooltip from 'components/Tooltip' import Tooltip from 'components/Tooltip'
import TooltipText from 'components/TooltipText' import TooltipText from 'components/TooltipText'
import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination' import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination'
import { EmptyPlaceholder } from 'layout/EmptyPlaceholder' import { EmptyPlaceholderTd } from 'layout/EmptyPlaceholder'
export const makeRowRender = (): RenderRowType => { export const makeRowRender = (): RenderRowType => {
const UdpRoutersRenderRow = (row) => ( const UdpRoutersRenderRow = (row) => (
@ -81,9 +81,7 @@ export const UdpRoutersRender = ({
{(isEmpty || !!error) && ( {(isEmpty || !!error) && (
<AriaTfoot> <AriaTfoot>
<AriaTr> <AriaTr>
<AriaTd fullColSpan> <EmptyPlaceholderTd message={error ? 'Failed to fetch data' : 'No data available'} />
<EmptyPlaceholder message={error ? 'Failed to fetch data' : 'No data available'} />
</AriaTd>
</AriaTr> </AriaTr>
</AriaTfoot> </AriaTfoot>
)} )}

6
webui/src/pages/udp/UdpServices.tsx
View File

@ -14,7 +14,7 @@ import SortableTh from 'components/tables/SortableTh'
import Tooltip from 'components/Tooltip' import Tooltip from 'components/Tooltip'
import TooltipText from 'components/TooltipText' import TooltipText from 'components/TooltipText'
import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination' import useFetchWithPagination, { pagesResponseInterface, RenderRowType } from 'hooks/use-fetch-with-pagination'
import { EmptyPlaceholder } from 'layout/EmptyPlaceholder' import { EmptyPlaceholderTd } from 'layout/EmptyPlaceholder'
export const makeRowRender = (): RenderRowType => { export const makeRowRender = (): RenderRowType => {
const UdpServicesRenderRow = (row) => ( const UdpServicesRenderRow = (row) => (
@ -78,9 +78,7 @@ export const UdpServicesRender = ({
{(isEmpty || !!error) && ( {(isEmpty || !!error) && (
<AriaTfoot> <AriaTfoot>
<AriaTr> <AriaTr>
<AriaTd fullColSpan> <EmptyPlaceholderTd message={error ? 'Failed to fetch data' : 'No data available'} />
<EmptyPlaceholder message={error ? 'Failed to fetch data' : 'No data available'} />
</AriaTd>
</AriaTr> </AriaTr>
</AriaTfoot> </AriaTfoot>
)} )}