sforkowany z mirror/soapbox
Remove old React Query stuff
rodzic
2c6c281568
commit
3a48082dc9
|
@ -17,7 +17,6 @@ import * as BuildConfig from 'soapbox/build_config';
|
||||||
import GdprBanner from 'soapbox/components/gdpr-banner';
|
import GdprBanner from 'soapbox/components/gdpr-banner';
|
||||||
import Helmet from 'soapbox/components/helmet';
|
import Helmet from 'soapbox/components/helmet';
|
||||||
import LoadingScreen from 'soapbox/components/loading-screen';
|
import LoadingScreen from 'soapbox/components/loading-screen';
|
||||||
import { AuthProvider, useAuth } from 'soapbox/contexts/auth-context';
|
|
||||||
import AuthLayout from 'soapbox/features/auth_layout';
|
import AuthLayout from 'soapbox/features/auth_layout';
|
||||||
import EmbeddedStatus from 'soapbox/features/embedded-status';
|
import EmbeddedStatus from 'soapbox/features/embedded-status';
|
||||||
import PublicLayout from 'soapbox/features/public_layout';
|
import PublicLayout from 'soapbox/features/public_layout';
|
||||||
|
@ -41,7 +40,6 @@ import {
|
||||||
} from 'soapbox/hooks';
|
} from 'soapbox/hooks';
|
||||||
import MESSAGES from 'soapbox/locales/messages';
|
import MESSAGES from 'soapbox/locales/messages';
|
||||||
import { queryClient } from 'soapbox/queries/client';
|
import { queryClient } from 'soapbox/queries/client';
|
||||||
import { useAxiosInterceptors } from 'soapbox/queries/client';
|
|
||||||
import { useCachedLocationHandler } from 'soapbox/utils/redirect';
|
import { useCachedLocationHandler } from 'soapbox/utils/redirect';
|
||||||
import { generateThemeCss } from 'soapbox/utils/theme';
|
import { generateThemeCss } from 'soapbox/utils/theme';
|
||||||
|
|
||||||
|
@ -65,7 +63,7 @@ const loadInitial = () => {
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
return async(dispatch, getState) => {
|
return async(dispatch, getState) => {
|
||||||
// Await for authenticated fetch
|
// Await for authenticated fetch
|
||||||
const account = await dispatch(fetchMe());
|
await dispatch(fetchMe());
|
||||||
// Await for feature detection
|
// Await for feature detection
|
||||||
await dispatch(loadInstance());
|
await dispatch(loadInstance());
|
||||||
// Await for configuration
|
// Await for configuration
|
||||||
|
@ -78,8 +76,6 @@ const loadInitial = () => {
|
||||||
if (pepeEnabled && !state.me) {
|
if (pepeEnabled && !state.me) {
|
||||||
await dispatch(fetchVerificationConfig());
|
await dispatch(fetchVerificationConfig());
|
||||||
}
|
}
|
||||||
|
|
||||||
return account;
|
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -209,9 +205,6 @@ interface ISoapboxLoad {
|
||||||
/** Initial data loader. */
|
/** Initial data loader. */
|
||||||
const SoapboxLoad: React.FC<ISoapboxLoad> = ({ children }) => {
|
const SoapboxLoad: React.FC<ISoapboxLoad> = ({ children }) => {
|
||||||
const dispatch = useAppDispatch();
|
const dispatch = useAppDispatch();
|
||||||
const { setAccount, token, baseApiUri } = useAuth();
|
|
||||||
|
|
||||||
useAxiosInterceptors(token, baseApiUri);
|
|
||||||
|
|
||||||
const me = useAppSelector(state => state.me);
|
const me = useAppSelector(state => state.me);
|
||||||
const account = useOwnAccount();
|
const account = useOwnAccount();
|
||||||
|
@ -241,8 +234,7 @@ const SoapboxLoad: React.FC<ISoapboxLoad> = ({ children }) => {
|
||||||
|
|
||||||
// Load initial data from the API
|
// Load initial data from the API
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
dispatch(loadInitial()).then((account) => {
|
dispatch(loadInitial()).then(() => {
|
||||||
setAccount(account);
|
|
||||||
setIsLoaded(true);
|
setIsLoaded(true);
|
||||||
}).catch(() => {
|
}).catch(() => {
|
||||||
setIsLoaded(true);
|
setIsLoaded(true);
|
||||||
|
@ -301,7 +293,6 @@ const SoapboxHead: React.FC<ISoapboxHead> = ({ children }) => {
|
||||||
const Soapbox: React.FC = () => {
|
const Soapbox: React.FC = () => {
|
||||||
return (
|
return (
|
||||||
<Provider store={store}>
|
<Provider store={store}>
|
||||||
<AuthProvider>
|
|
||||||
<QueryClientProvider client={queryClient}>
|
<QueryClientProvider client={queryClient}>
|
||||||
<SoapboxHead>
|
<SoapboxHead>
|
||||||
<SoapboxLoad>
|
<SoapboxLoad>
|
||||||
|
@ -309,7 +300,6 @@ const Soapbox: React.FC = () => {
|
||||||
</SoapboxLoad>
|
</SoapboxLoad>
|
||||||
</SoapboxHead>
|
</SoapboxHead>
|
||||||
</QueryClientProvider>
|
</QueryClientProvider>
|
||||||
</AuthProvider>
|
|
||||||
</Provider>
|
</Provider>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,77 +0,0 @@
|
||||||
|
|
||||||
import React, {
|
|
||||||
createContext,
|
|
||||||
useContext,
|
|
||||||
useEffect,
|
|
||||||
useMemo,
|
|
||||||
useState,
|
|
||||||
} from 'react';
|
|
||||||
|
|
||||||
import { localState } from 'soapbox/reducers/auth';
|
|
||||||
import { parseBaseURL } from 'soapbox/utils/auth';
|
|
||||||
|
|
||||||
const AuthContext = createContext(null as any);
|
|
||||||
|
|
||||||
interface IAccount {
|
|
||||||
acct: string
|
|
||||||
avatar: string
|
|
||||||
avatar_static: string
|
|
||||||
bot: boolean
|
|
||||||
created_at: string
|
|
||||||
discoverable: boolean
|
|
||||||
display_name: string
|
|
||||||
emojis: string[]
|
|
||||||
fields: any // not sure
|
|
||||||
followers_count: number
|
|
||||||
following_count: number
|
|
||||||
group: boolean
|
|
||||||
header: string
|
|
||||||
header_static: string
|
|
||||||
id: string
|
|
||||||
last_status_at: string
|
|
||||||
location: string
|
|
||||||
locked: boolean
|
|
||||||
note: string
|
|
||||||
statuses_count: number
|
|
||||||
url: string
|
|
||||||
username: string
|
|
||||||
verified: boolean
|
|
||||||
website: string
|
|
||||||
}
|
|
||||||
|
|
||||||
export const AuthProvider: React.FC<any> = ({ children }: { children: React.ReactNode }) => {
|
|
||||||
const [account, setAccount] = useState<IAccount>();
|
|
||||||
const [token, setToken] = useState<string>();
|
|
||||||
const [baseApiUri, setBaseApiUri] = useState<string>();
|
|
||||||
|
|
||||||
const value = useMemo(() => ({
|
|
||||||
account,
|
|
||||||
baseApiUri,
|
|
||||||
setAccount,
|
|
||||||
token,
|
|
||||||
}), [account]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const cachedAuth: any = localState?.toJS();
|
|
||||||
|
|
||||||
if (cachedAuth?.me) {
|
|
||||||
setToken(cachedAuth.users[cachedAuth.me].access_token);
|
|
||||||
setBaseApiUri(parseBaseURL(cachedAuth.users[cachedAuth.me].url));
|
|
||||||
}
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<AuthContext.Provider value={value}>
|
|
||||||
{children}
|
|
||||||
</AuthContext.Provider>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
interface IAuth {
|
|
||||||
account: IAccount
|
|
||||||
baseApiUri: string
|
|
||||||
setAccount(account: IAccount): void
|
|
||||||
token: string
|
|
||||||
}
|
|
||||||
|
|
||||||
export const useAuth = (): IAuth => useContext(AuthContext);
|
|
|
@ -1,38 +1,4 @@
|
||||||
import { QueryClient } from '@tanstack/react-query';
|
import { QueryClient } from '@tanstack/react-query';
|
||||||
import axios, { AxiosRequestConfig } from 'axios';
|
|
||||||
|
|
||||||
import * as BuildConfig from 'soapbox/build_config';
|
|
||||||
import { isURL } from 'soapbox/utils/auth';
|
|
||||||
|
|
||||||
const maybeParseJSON = (data: string) => {
|
|
||||||
try {
|
|
||||||
return JSON.parse(data);
|
|
||||||
} catch (Exception) {
|
|
||||||
return data;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const API = axios.create({
|
|
||||||
transformResponse: [maybeParseJSON],
|
|
||||||
});
|
|
||||||
|
|
||||||
const useAxiosInterceptors = (token: string, baseApiUri: string) => {
|
|
||||||
API.interceptors.request.use(
|
|
||||||
async (config: AxiosRequestConfig) => {
|
|
||||||
if (token) {
|
|
||||||
config.baseURL = isURL(BuildConfig.BACKEND_URL) ? BuildConfig.BACKEND_URL : baseApiUri;
|
|
||||||
// eslint-disable-next-line no-param-reassign
|
|
||||||
config.headers = {
|
|
||||||
...config.headers,
|
|
||||||
Authorization: (token ? `Bearer ${token}` : null) as string | number | boolean | string[] | undefined,
|
|
||||||
} as any;
|
|
||||||
}
|
|
||||||
|
|
||||||
return config;
|
|
||||||
},
|
|
||||||
(error) => Promise.reject(error),
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const queryClient = new QueryClient({
|
const queryClient = new QueryClient({
|
||||||
defaultOptions: {
|
defaultOptions: {
|
||||||
|
@ -40,8 +6,9 @@ const queryClient = new QueryClient({
|
||||||
refetchOnWindowFocus: false,
|
refetchOnWindowFocus: false,
|
||||||
staleTime: 60000, // 1 minute
|
staleTime: 60000, // 1 minute
|
||||||
cacheTime: Infinity,
|
cacheTime: Infinity,
|
||||||
|
retry: false,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
export { API as default, queryClient, useAxiosInterceptors };
|
export { queryClient };
|
||||||
|
|
Ładowanie…
Reference in New Issue