diff --git a/.changeset/tough-insects-breathe.md b/.changeset/tough-insects-breathe.md
new file mode 100644
index 000000000..65e09c5b9
--- /dev/null
+++ b/.changeset/tough-insects-breathe.md
@@ -0,0 +1,5 @@
+---
+"@carrot-kpi/host-frontend": minor
+---
+
+Add connect wallet button to wallet disconnected modal
diff --git a/packages/frontend/src/components/authenticate/index.tsx b/packages/frontend/src/components/authenticate/index.tsx
index 5d0190202..176401b21 100644
--- a/packages/frontend/src/components/authenticate/index.tsx
+++ b/packages/frontend/src/components/authenticate/index.tsx
@@ -3,9 +3,9 @@ import React, { useCallback, useEffect, useState } from "react";
 import LogoIcon from "../../icons/logo-icon";
 import { t } from "i18next";
 import { useAccount, useSignMessage } from "wagmi";
-import WalletDisconnected from "../../icons/wallet-disconnected";
 import { useSetPinningProxyJWT } from "../../hooks/useSetPinningProxyJWT";
 import { PINNING_PROXY_URL } from "../../constants";
+import { WalletDisconnected } from "../wallet-disconnected";
 
 interface AuthenticateProps {
     onCancel: () => void;
@@ -112,17 +112,7 @@ export const Authenticate = ({ onCancel }: AuthenticateProps) => {
                         </div>
                     </>
                 ) : (
-                    <>
-                        <WalletDisconnected className="w-52" />
-                        <div className="flex flex-col gap-3 items-center">
-                            <Typography variant="h4">
-                                {t("wallet.disconnected.title")}
-                            </Typography>
-                            <Typography>
-                                {t("wallet.disconnected.description")}
-                            </Typography>
-                        </div>
-                    </>
+                    <WalletDisconnected />
                 )}
             </div>
         </div>
diff --git a/packages/frontend/src/components/connect-wallet/index.tsx b/packages/frontend/src/components/connect-wallet/index.tsx
index eb4feb54f..bf526cebf 100644
--- a/packages/frontend/src/components/connect-wallet/index.tsx
+++ b/packages/frontend/src/components/connect-wallet/index.tsx
@@ -16,12 +16,17 @@ import { cva } from "class-variance-authority";
 const rootStyles = cva(["flex", "gap-4"]);
 
 interface ConnectWalletProps {
+    chainList?: boolean;
     className?: {
         root?: string;
+        connectButton?: string;
     };
 }
 
-export const ConnectWallet = ({ className }: ConnectWalletProps) => {
+export const ConnectWallet = ({
+    chainList = true,
+    className,
+}: ConnectWalletProps) => {
     const { t } = useTranslation();
     const { chain } = useNetwork();
     const { address, connector: activeConnector } = useAccount();
@@ -127,42 +132,45 @@ export const ConnectWallet = ({ className }: ConnectWalletProps) => {
                 />
             )}
             <div className={rootStyles({ className: className?.root })}>
-                <div
-                    className={`h-12 w-fit flex items-center ${
-                        __LIBRARY_MODE__ || !multipleEnabledChains
-                            ? ""
-                            : "cursor-pointer"
-                    } gap-3`}
-                    onClick={
-                        multipleEnabledChains
-                            ? handleNetworksPopoverOpen
-                            : undefined
-                    }
-                    ref={setNetworksPopoverAnchor}
-                >
-                    <ChainIcon
-                        backgroundColor={
-                            supportedChain
-                                ? SUPPORTED_CHAINS[chainId as ChainId]
-                                      .iconBackgroundColor
-                                : "#ff0000"
+                {chainList && (
+                    <div
+                        className={`h-12 w-fit flex items-center ${
+                            __LIBRARY_MODE__ || !multipleEnabledChains
+                                ? ""
+                                : "cursor-pointer"
+                        } gap-3`}
+                        onClick={
+                            multipleEnabledChains
+                                ? handleNetworksPopoverOpen
+                                : undefined
                         }
-                        logo={<Logo width={18} height={18} />}
-                    />
-                    <div className="flex flex-col">
-                        <Typography variant="xs">
-                            {t("connect.wallet.network")}
-                        </Typography>
-                        <Typography variant="sm">
-                            {supportedChain ? chainName : "Unsupported"}
-                        </Typography>
+                        ref={setNetworksPopoverAnchor}
+                    >
+                        <ChainIcon
+                            backgroundColor={
+                                supportedChain
+                                    ? SUPPORTED_CHAINS[chainId as ChainId]
+                                          .iconBackgroundColor
+                                    : "#ff0000"
+                            }
+                            logo={<Logo width={18} height={18} />}
+                        />
+                        <div className="flex flex-col">
+                            <Typography variant="xs">
+                                {t("connect.wallet.network")}
+                            </Typography>
+                            <Typography variant="sm">
+                                {supportedChain ? chainName : "Unsupported"}
+                            </Typography>
+                        </div>
+                        {!__LIBRARY_MODE__ && multipleEnabledChains && (
+                            <CaretDown className="w-3" />
+                        )}
                     </div>
-                    {!__LIBRARY_MODE__ && multipleEnabledChains && (
-                        <CaretDown className="w-3" />
-                    )}
-                </div>
+                )}
                 {address ? (
                     <Button
+                        size="small"
                         ref={setConnectWallet}
                         onClick={handleAccountPopoverOpen}
                         className={{
@@ -173,10 +181,11 @@ export const ConnectWallet = ({ className }: ConnectWalletProps) => {
                     </Button>
                 ) : (
                     <Button
+                        size="small"
                         ref={setConnectWallet}
                         onClick={handleConnectPopoverOpen}
                         className={{
-                            root: "h-12 px-3 w-full xl:w-fit",
+                            root: className?.connectButton,
                         }}
                     >
                         {t("connect.wallet")}
diff --git a/packages/frontend/src/components/permissioned/index.tsx b/packages/frontend/src/components/permissioned/index.tsx
index 06faa053a..19167beb3 100644
--- a/packages/frontend/src/components/permissioned/index.tsx
+++ b/packages/frontend/src/components/permissioned/index.tsx
@@ -3,8 +3,8 @@ import { t } from "i18next";
 import ErrorIcon from "../../icons/error";
 import { Button, Typography } from "@carrot-kpi/ui";
 import { useAccount } from "wagmi";
-import WalletDisconnected from "../../icons/wallet-disconnected";
 import { DISCORD_LINK } from "../../constants";
+import { WalletDisconnected } from "../wallet-disconnected";
 
 interface PermissionedProps {
     onBack: () => void;
@@ -51,17 +51,7 @@ export const Permissioned = ({ onBack }: PermissionedProps) => {
                         </div>
                     </>
                 ) : (
-                    <>
-                        <WalletDisconnected className="w-52" />
-                        <div className="flex flex-col gap-3 items-center">
-                            <Typography variant="h4">
-                                {t("wallet.disconnected.title")}
-                            </Typography>
-                            <Typography>
-                                {t("wallet.disconnected.description")}
-                            </Typography>
-                        </div>
-                    </>
+                    <WalletDisconnected />
                 )}
             </div>
         </div>
diff --git a/packages/frontend/src/components/ui/navbar/index.tsx b/packages/frontend/src/components/ui/navbar/index.tsx
index aacb44164..23542a4ed 100644
--- a/packages/frontend/src/components/ui/navbar/index.tsx
+++ b/packages/frontend/src/components/ui/navbar/index.tsx
@@ -131,7 +131,11 @@ export const Navbar = ({
                     </nav>
                     <div className="flex md:flex-row items-center gap-4">
                         <div className="hidden md:block">
-                            <ConnectWallet />
+                            <ConnectWallet
+                                className={{
+                                    connectButton: "h-12 px-3 w-full xl:w-fit",
+                                }}
+                            />
                         </div>
                         <Button
                             ref={setPreferencesAnchor}
diff --git a/packages/frontend/src/components/wallet-disconnected/index.tsx b/packages/frontend/src/components/wallet-disconnected/index.tsx
new file mode 100644
index 000000000..cc0b5d3fa
--- /dev/null
+++ b/packages/frontend/src/components/wallet-disconnected/index.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+import { t } from "i18next";
+import WalletDisconnectedIcon from "../../icons/wallet-disconnected";
+import { Typography } from "@carrot-kpi/ui";
+import { ConnectWallet } from "../connect-wallet";
+
+export const WalletDisconnected = () => {
+    return (
+        <div className="flex flex-col gap-4 items-center">
+            <WalletDisconnectedIcon className="w-52" />
+            <div className="flex flex-col gap-3 items-center mb-4">
+                <Typography variant="h4">
+                    {t("wallet.disconnected.title")}
+                </Typography>
+                <Typography>{t("wallet.disconnected.description")}</Typography>
+            </div>
+            <ConnectWallet chainList={false} />
+        </div>
+    );
+};