app/components/syntax/HeroBackground.tsx

@@ -1,4 +1,4 @@
-import { useId } from "react";
+import React, { useId } from "react";
 
 export function HeroBackground(props: React.ComponentPropsWithoutRef<"svg">) {
   const id = useId();

app/components/syntax/Icon.tsx

@@ -5,7 +5,7 @@ import { PluginsIcon } from "@syntax/icons/PluginsIcon";
 import { PresetsIcon } from "@syntax/icons/PresetsIcon";
 import { ThemingIcon } from "@syntax/icons/ThemingIcon";
 import { WarningIcon } from "@syntax/icons/WarningIcon";
-import { useId } from "react";
+import React, { useId } from "react";
 import clsx from "clsx";
 
 const icons = {

app/components/syntax/Logo.tsx

@@ -1,11 +1,6 @@
-function LogomarkPaths() {
-  // return (
-  //   <g fill="none" stroke="#38BDF8" strokeLinejoin="round" strokeWidth={3}>
-  //     <path d="M10.308 5L18 17.5 10.308 30 2.615 17.5 10.308 5z" />
-  //     <path d="M18 17.5L10.308 5h15.144l7.933 12.5M18 17.5h15.385L25.452 30H10.308L18 17.5z" />
-  //   </g>
-  // );
+import React from "react";
 
+function LogomarkPaths() {
   return (
     <>
       <defs>
@@ -33,25 +28,6 @@ function LogomarkPaths() {
   );
 }
 
-export function LogoWithText(props: React.ComponentPropsWithoutRef<"svg">) {
-  return (
-    <svg viewBox="0 0 231 38" {...props}>
-      <LogomarkPaths />
-      <text
-        className="hidden lg:block fill-zinc-900 dark:fill-zinc-100"
-        fontFamily="Inter Variable, sans-serif"
-        fontSize={24}
-        fontWeight="bold"
-        letterSpacing="-.02em"
-        x={74}
-        y={26}
-      >
-        Memento Dev
-      </text>
-    </svg>
-  );
-}
-
 export function Logo(props: React.ComponentPropsWithoutRef<"svg">) {
   return (
     <svg viewBox="0 0 58 38" {...props}>

app/components/syntax/MobileNavigation.tsx

@@ -1,4 +1,4 @@
-import { Suspense, useCallback, useEffect, useState } from "react";
+import React, { Suspense, useCallback, useEffect, useState } from "react";
 import { usePageContext } from "vike-react/usePageContext";
 import { Dialog, DialogPanel } from "@headlessui/react";
 import { Navigation } from "@syntax/Navigation";
@@ -32,11 +32,12 @@ function CloseOnNavigation({ close }: { close: () => void }) {
 }
 
 export function MobileNavigation() {
-  let [isOpen, setIsOpen] = useState(false);
-  let close = useCallback(() => setIsOpen(false), [setIsOpen]);
+  const [isOpen, setIsOpen] = useState(false);
+  const close = useCallback(() => setIsOpen(false), [setIsOpen]);
 
   function onLinkClick(event: React.MouseEvent<HTMLAnchorElement>) {
-    let link = event.currentTarget;
+    const link = event.currentTarget;
+
     if (
       link.pathname + link.search + link.hash ===
       window.location.pathname + window.location.search + window.location.hash

app/components/syntax/Navigation.tsx

@@ -1,8 +1,8 @@
 import { ChevronDownIcon, ChevronUpIcon } from "@heroicons/react/24/solid";
 import { usePageContext } from "vike-react/usePageContext";
+import React, { useEffect, useState } from "react";
 import { Link } from "@/components/common/Link";
 import { navigation } from "@/lib/navigation";
-import { useEffect, useState } from "react";
 import clsx from "clsx";
 
 type NavigationItemProps = {

app/components/syntax/PrevNextLinks.tsx

@@ -1,6 +1,7 @@
 import { usePageContext } from "vike-react/usePageContext";
 import { Link } from "@/components/common/Link";
 import { navigation } from "@/lib/navigation";
+import React from "react";
 import clsx from "clsx";
 
 function ArrowIcon(props: React.ComponentPropsWithoutRef<"svg">) {

app/components/syntax/Prose.tsx

@@ -8,7 +8,7 @@ export function Prose<T extends React.ElementType = "div">({
 }: React.ComponentPropsWithoutRef<T> & {
   as?: T;
 }) {
-  let Component = as ?? "div";
+  const Component = as ?? "div";
 
   return (
     <Component