From f554ad95e95bfa5469e1d2813444147f627901f8 Mon Sep 17 00:00:00 2001
From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com>
Date: Mon, 4 Sep 2023 16:34:53 +0530
Subject: [PATCH] fix: favicon path on Plane space (#2077)

* fix: favicon path

* chore: add webmanifest file

* favicon fixes with nginx

---------

Co-authored-by: sriram veeraghanta <veeraghanta.sriram@gmail.com>
---
 space/pages/_app.tsx               | 12 +++++++-----
 space/public/site.webmanifest.json | 13 +++++++++++++
 2 files changed, 20 insertions(+), 5 deletions(-)
 create mode 100644 space/public/site.webmanifest.json

diff --git a/space/pages/_app.tsx b/space/pages/_app.tsx
index 2995edbbf..33c137d41 100644
--- a/space/pages/_app.tsx
+++ b/space/pages/_app.tsx
@@ -12,6 +12,8 @@ import MobxStoreInit from "lib/mobx/store-init";
 // constants
 import { SITE_NAME, SITE_DESCRIPTION, SITE_URL, TWITTER_USER_NAME, SITE_KEYWORDS, SITE_TITLE } from "constants/seo";
 
+const prefix = parseInt(process.env.NEXT_PUBLIC_DEPLOY_WITH_NGINX || "0") === 0 ? "/" : "/spaces/";
+
 function MyApp({ Component, pageProps }: AppProps) {
   return (
     <MobxStoreProvider>
@@ -25,11 +27,11 @@ function MyApp({ Component, pageProps }: AppProps) {
         <meta property="og:description" content={SITE_DESCRIPTION} />
         <meta name="keywords" content={SITE_KEYWORDS} />
         <meta name="twitter:site" content={`@${TWITTER_USER_NAME}`} />
-        <link rel="apple-touch-icon" sizes="180x180" href="/spaces/favicon/apple-touch-icon.png" />
-        <link rel="icon" type="image/png" sizes="32x32" href="/spaces/favicon/favicon-32x32.png" />
-        <link rel="icon" type="image/png" sizes="16x16" href="/spaces/favicon/favicon-16x16.png" />
-        <link rel="manifest" href="/spaces/site.webmanifest.json" />
-        <link rel="shortcut icon" href="/spaces/favicon/favicon.ico" />
+        <link rel="apple-touch-icon" sizes="180x180" href={`${prefix}favicon/apple-touch-icon.png`} />
+        <link rel="icon" type="image/png" sizes="32x32" href={`${prefix}favicon/favicon-32x32.png`} />
+        <link rel="icon" type="image/png" sizes="16x16" href={`${prefix}favicon/favicon-16x16.png`} />
+        <link rel="manifest" href={`${prefix}site.webmanifest.json`} />
+        <link rel="shortcut icon" href={`${prefix}favicon/favicon.ico`} />
       </Head>
       <ToastContextProvider>
         <ThemeProvider themes={["light", "dark"]} defaultTheme="system" enableSystem>
diff --git a/space/public/site.webmanifest.json b/space/public/site.webmanifest.json
new file mode 100644
index 000000000..4c32ec6e3
--- /dev/null
+++ b/space/public/site.webmanifest.json
@@ -0,0 +1,13 @@
+{
+  "name": "Plane Space",
+  "short_name": "Plane Space",
+  "description": "Plane helps you plan your issues, cycles, and product modules.",
+  "start_url": ".",
+  "display": "standalone",
+  "background_color": "#f9fafb",
+  "theme_color": "#3f76ff",
+  "icons": [
+    { "src": "/favicon/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" },
+    { "src": "/favicon/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" }
+  ]
+}