chore(deps): update react to 18 (#2943)

src/context/InteractionContext.tsx

@@ -2,14 +2,15 @@ import React from 'react';
 import useInteraction from '../hooks/useInteraction';
 
 interface InteractionContextProps {
-  isTouch: boolean;
+  isTouch?: boolean;
+  children?: React.ReactNode;
 }
 
 export const InteractionContext = React.createContext<InteractionContextProps>({
   isTouch: false,
 });
 
-export const InteractionProvider: React.FC = ({ children }) => {
+export const InteractionProvider = ({ children }: InteractionContextProps) => {
   const isTouch = useInteraction();
 
   return (

src/context/SettingsContext.tsx

@@ -4,6 +4,7 @@ import type { PublicSettingsResponse } from '../../server/interfaces/api/setting
 
 export interface SettingsContextProps {
   currentSettings: PublicSettingsResponse;
+  children?: React.ReactNode;
 }
 
 const defaultSettings = {
@@ -29,10 +30,10 @@ export const SettingsContext = React.createContext<SettingsContextProps>({
   currentSettings: defaultSettings,
 });
 
-export const SettingsProvider: React.FC<SettingsContextProps> = ({
+export const SettingsProvider = ({
   children,
   currentSettings,
-}) => {
+}: SettingsContextProps) => {
   const { data, error } = useSWR<PublicSettingsResponse>(
     '/api/v1/settings/public',
     { fallbackData: currentSettings }

src/context/UserContext.tsx

@@ -5,6 +5,7 @@ import { useUser } from '../hooks/useUser';
 
 interface UserContextProps {
   initialUser: User;
+  children?: React.ReactNode;
 }
 
 /**
@@ -12,10 +13,7 @@ interface UserContextProps {
  * cache on server side render. It also will handle redirecting the user to
  * the login page if their session ever becomes invalid.
  */
-export const UserContext: React.FC<UserContextProps> = ({
-  initialUser,
-  children,
-}) => {
+export const UserContext = ({ initialUser, children }: UserContextProps) => {
   const { user, error, revalidate } = useUser({ initialData: initialUser });
   const router = useRouter();
   const routing = useRef(false);