Load favicon from local webview assets

web/components/FavIcon.tsx

@@ -0,0 +1,13 @@
+type FavIconProps = {
+  className?: string;
+};
+
+const FavIcon = ({ className }: FavIconProps) => (
+  <img
+    src="favicon.svg"
+    alt="Compass logo"
+    className={`w-12 h-12 ${className ?? ""}`}
+  />
+);
+
+export default FavIcon;

web/components/site-logo.tsx

@@ -1,7 +1,7 @@
 import Link from 'next/link'
 import clsx from 'clsx'
 import {Row} from 'web/components/layout/row'
-import FavIcon from "web/public/FavIcon";
+import FavIcon from "web/components/FavIcon";
 import {isProd} from "common/envs/is-prod";
 
 export default function SiteLogo(props: {

web/components/widgets/loading-indicator.tsx

@@ -1,6 +1,6 @@
 import clsx from 'clsx'
 import {useEffect, useRef} from 'react'
-import FavIcon from "web/public/FavIcon";
+import FavIcon from "web/components/FavIcon";
 
 export type SpinnerSize = 'sm' | 'md' | 'lg'
 

web/pages/register.tsx

@@ -7,7 +7,7 @@ import {signupThenMaybeRedirectToSignup} from "web/lib/util/signup"
 
 import {createUserWithEmailAndPassword} from "firebase/auth"
 import {auth} from "web/lib/firebase/users"
-import FavIcon from "web/public/FavIcon"
+import FavIcon from "web/components/FavIcon"
 import {PageBase} from "web/components/page-base"
 import {getProfileRow} from "common/profiles/profile"
 import {db} from "web/lib/supabase/db"

web/pages/signin.tsx

@@ -4,7 +4,6 @@ import {useSearchParams} from "next/navigation"
 import React, {Suspense, useEffect, useState} from "react"
 import Link from "next/link"
 import {auth, firebaseLogin} from "web/lib/firebase/users"
-import FavIcon from "web/public/FavIcon"
 
 import {signInWithEmailAndPassword} from "firebase/auth"
 import {getProfileRow} from "common/profiles/profile"
@@ -16,6 +15,7 @@ import {PageBase} from "web/components/page-base"
 import {GoogleButton} from "web/components/buttons/sign-up-button"
 import {SEO} from "web/components/SEO"
 import {logger} from "common/logging";
+import FavIcon from "web/components/FavIcon";
 
 export default function LoginPage() {
   return (

web/public/FavIcon.tsx

@@ -1,11 +0,0 @@
-
-import Image from "next/image";
-
-type FavIconProps = React.SVGProps<SVGSVGElement>;
-
-const FavIcon: React.FC<FavIconProps> = ({ className }) => (
-  // Need full domain for favicon to work properly on Webview
-  <Image src="https://compassmeet.com/favicon.ico" alt="Compass logo" width={500} height={500} className={"w-12 h-12 " + className}/>
-);
-
-export default FavIcon;