build: upgrade to yarn 3

Also upgrades various frontend dependencies.

We can't upgrade to typescript 4.5 yet, because
https://github.com/yarnpkg/berry/pull/3760 is not released yet.

4 files changed, 59 insertions, 49 deletions

diff --git a/language-web/src/main/js/App.tsx b/language-web/src/main/js/App.tsx
index 2567aa9c..54f92f9a 100644
--- a/language-web/src/main/js/App.tsx
+++ b/language-web/src/main/js/App.tsx
@@ -10,49 +10,51 @@ import { EditorArea } from './editor/EditorArea';
 import { EditorButtons } from './editor/EditorButtons';
 import { GenerateButton } from './editor/GenerateButton';
 
-export const App = (): JSX.Element => (
-  <Box
-    display="flex"
-    flexDirection="column"
-    sx={{ height: '100vh' }}
-  >
-    <AppBar
-      position="static"
-      color="inherit"
-    >
-      <Toolbar>
-        <IconButton
-          edge="start"
-          sx={{ mr: 2 }}
-          color="inherit"
-          aria-label="menu"
-        >
-          <MenuIcon />
-        </IconButton>
-        <Typography
-          variant="h6"
-          component="h1"
-          flexGrow={1}
-        >
-          Refinery
-        </Typography>
-      </Toolbar>
-    </AppBar>
+export function App(): JSX.Element {
+  return (
     <Box
       display="flex"
-      justifyContent="space-between"
-      alignItems="center"
-      p={1}
-    >
-      <EditorButtons />
-      <GenerateButton />
-    </Box>
-    <Box
-      flexGrow={1}
-      flexShrink={1}
-      sx={{ overflow: 'auto' }}
+      flexDirection="column"
+      sx={{ height: '100vh' }}
     >
-      <EditorArea />
+      <AppBar
+        position="static"
+        color="inherit"
+      >
+        <Toolbar>
+          <IconButton
+            edge="start"
+            sx={{ mr: 2 }}
+            color="inherit"
+            aria-label="menu"
+          >
+            <MenuIcon />
+          </IconButton>
+          <Typography
+            variant="h6"
+            component="h1"
+            flexGrow={1}
+          >
+            Refinery
+          </Typography>
+        </Toolbar>
+      </AppBar>
+      <Box
+        display="flex"
+        justifyContent="space-between"
+        alignItems="center"
+        p={1}
+      >
+        <EditorButtons />
+        <GenerateButton />
+      </Box>
+      <Box
+        flexGrow={1}
+        flexShrink={1}
+        sx={{ overflow: 'auto' }}
+      >
+        <EditorArea />
+      </Box>
     </Box>
-  </Box>
-);
+  );
+}
diff --git a/language-web/src/main/js/RootStore.tsx b/language-web/src/main/js/RootStore.tsx
index 96e1b26a..baf0b61e 100644
--- a/language-web/src/main/js/RootStore.tsx
+++ b/language-web/src/main/js/RootStore.tsx
@@ -16,11 +16,19 @@ export class RootStore {
 
 const StoreContext = createContext<RootStore | undefined>(undefined);
 
-export const RootStoreProvider: React.FC<{ rootStore: RootStore }> = ({ children, rootStore }) => (
-  <StoreContext.Provider value={rootStore}>
-    {children}
-  </StoreContext.Provider>
-);
+export interface RootStoreProviderProps {
+  children: JSX.Element;
+
+  rootStore: RootStore;
+}
+
+export function RootStoreProvider({ children, rootStore }: RootStoreProviderProps): JSX.Element {
+  return (
+    <StoreContext.Provider value={rootStore}>
+      {children}
+    </StoreContext.Provider>
+  );
+}
 
 export const useRootStore = (): RootStore => {
   const rootStore = useContext(StoreContext);
diff --git a/language-web/src/main/js/utils/PendingTask.ts b/language-web/src/main/js/utils/PendingTask.ts
index de59a99b..51b79fb0 100644
--- a/language-web/src/main/js/utils/PendingTask.ts
+++ b/language-web/src/main/js/utils/PendingTask.ts
@@ -9,7 +9,7 @@ export class PendingTask<T> {
 
   private resolved = false;
 
-  private timeout: NodeJS.Timeout | null;
+  private timeout: number | null;
 
   constructor(
     resolveCallback: (value: T) => void,
diff --git a/language-web/src/main/js/utils/Timer.ts b/language-web/src/main/js/utils/Timer.ts
index efde6633..8f653070 100644
--- a/language-web/src/main/js/utils/Timer.ts
+++ b/language-web/src/main/js/utils/Timer.ts
@@ -3,7 +3,7 @@ export class Timer {
 
   readonly defaultTimeout: number;
 
-  timeout: NodeJS.Timeout | null = null;
+  timeout: number | null = null;
 
   constructor(callback: () => void, defaultTimeout = 0) {
     this.callback = () => {