| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293 |
- /*!
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
- /*
- Base setup for anywhere we add react to the UI
- */
- import React, { PropsWithChildren, useEffect } from "react";
- import { BrowserRouter } from "react-router-dom";
- import { ChakraProvider } from "@chakra-ui/react";
- import { CacheProvider } from "@emotion/react";
- import type { EmotionCache } from "@emotion/cache";
- import { QueryClient, QueryClientProvider } from "react-query";
- import theme from "./theme";
- import { ContainerRefProvider, useContainerRef } from "./context/containerRef";
- import { TimezoneProvider } from "./context/timezone";
- import { AutoRefreshProvider } from "./context/autorefresh";
- import { isInputInFocus } from "./utils/useKeysPress";
- const queryClient = new QueryClient({
- defaultOptions: {
- queries: {
- notifyOnChangeProps: "tracked",
- refetchOnWindowFocus: false,
- retry: 1,
- retryDelay: 500,
- refetchOnMount: true, // Refetches stale queries, not "always"
- staleTime: 5 * 60 * 1000, // 5 minutes
- initialDataUpdatedAt: new Date().setMinutes(-6), // make sure initial data is already expired
- },
- mutations: {
- retry: 1,
- retryDelay: 500,
- },
- },
- });
- interface AppProps extends PropsWithChildren {
- cache: EmotionCache;
- }
- // Chakra needs to access the containerRef provider so our tooltips pick up the correct styles
- const ChakraApp = ({ children }: PropsWithChildren) => {
- const containerRef = useContainerRef();
- return (
- <ChakraProvider
- theme={theme}
- toastOptions={{ portalProps: { containerRef } }}
- >
- <QueryClientProvider client={queryClient}>
- <TimezoneProvider>
- <AutoRefreshProvider>
- <BrowserRouter>{children}</BrowserRouter>
- </AutoRefreshProvider>
- </TimezoneProvider>
- </QueryClientProvider>
- </ChakraProvider>
- );
- };
- function App({ children, cache }: AppProps) {
- useEffect(() => {
- localStorage.setItem(isInputInFocus, "false");
- }, []);
- return (
- <React.StrictMode>
- <CacheProvider value={cache}>
- <ContainerRefProvider>
- <ChakraApp>{children}</ChakraApp>
- </ContainerRefProvider>
- </CacheProvider>
- </React.StrictMode>
- );
- }
- export default App;
|