Upgrade dependencies & pnpm (#785)

* Updated log

* Updates to root

* Updates to pnpm

* successfully moved to pnpm

* type issue

* Local as the default provider

* Upgrade dependencies

* Revert to local

* Upgrade React

* Update node-fetch deps

* Fix types

* Ignore warnings

* Fix missing dependency

* Update pnpm-lock.yaml

* Add missing @types/cookie

* Upgrade dependencies

* Fix missing dependencies

* Update README.md

Co-authored-by: Bel Curcio <curciobel@gmail.com>

site/components/common/I18nWidget/I18nWidget.tsx

@@ -5,6 +5,7 @@ import { useRouter } from 'next/router'
 import s from './I18nWidget.module.css'
 import { Cross, ChevronUp } from '@components/icons'
 import ClickOutside from '@lib/click-outside'
+import Image from 'next/image'
 interface LOCALE_DATA {
   name: string
   img: {
@@ -50,12 +51,13 @@ const I18nWidget: FC = () => {
           onClick={() => setDisplay(!display)}
         >
           <button className={s.button} aria-label="Language selector">
-            <img
+            <Image
               width="20"
               height="20"
               className="block mr-2 w-5"
               src={`/${LOCALES_MAP[currentLocale].img.filename}`}
               alt={LOCALES_MAP[currentLocale].img.alt}
+              unoptimized
             />
             {options && (
               <span className="cursor-pointer">

site/components/common/Layout/Layout.tsx

@@ -53,6 +53,7 @@ interface Props {
     pages?: Page[]
     categories: Category[]
   }
+  children?: React.ReactNode
 }
 
 const ModalView: React.FC<{ modalView: string; closeModal(): any }> = ({

site/components/common/Navbar/NavbarRoot.tsx

@@ -1,9 +1,9 @@
-import { FC, useState, useEffect } from 'react'
+import { FC, useState, useEffect, ReactNode } from 'react'
 import throttle from 'lodash.throttle'
 import cn from 'clsx'
 import s from './Navbar.module.css'
 
-const NavbarRoot: FC = ({ children }) => {
+const NavbarRoot: FC<{ children?: ReactNode }> = ({ children }) => {
   const [hasScrolled, setHasScrolled] = useState(false)
 
   useEffect(() => {

site/components/common/SidebarLayout/SidebarLayout.tsx

@@ -1,10 +1,10 @@
-import React, { FC } from 'react'
+import React, { FC, ReactNode } from 'react'
 import { Cross, ChevronLeft } from '@components/icons'
 import { UserNav } from '@components/common'
 import cn from 'clsx'
 import s from './SidebarLayout.module.css'
 
-type ComponentProps = { className?: string } & (
+type ComponentProps = { className?: string; children?: ReactNode } & (
   | { handleClose: () => any; handleBack?: never }
   | { handleBack: () => any; handleClose?: never }
 )