diff --git a/apps/web/pages/404.tsx b/apps/web/pages/404.tsx
index d5023d1a5c..ec14c8be1b 100644
--- a/apps/web/pages/404.tsx
+++ b/apps/web/pages/404.tsx
@@ -1,13 +1,14 @@
import type { GetStaticPropsContext } from "next";
import Link from "next/link";
import { useRouter } from "next/router";
-import { useEffect, useState } from "react";
+import React, { useEffect, useState } from "react";
import { orgDomainConfig, subdomainSuffix } from "@calcom/features/ee/organizations/lib/orgDomains";
import { DOCS_URL, JOIN_DISCORD, WEBSITE_URL, IS_CALCOM } from "@calcom/lib/constants";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import { HeadSeo } from "@calcom/ui";
import { BookOpen, Check, ChevronRight, FileText, Shield } from "@calcom/ui/components/icon";
+import { Discord } from "@calcom/ui/components/icon/Discord";
import PageWrapper from "@components/PageWrapper";
@@ -205,14 +206,7 @@ export default function Custom404() {
className="relative flex items-start space-x-4 py-6 rtl:space-x-reverse">
@@ -350,14 +344,7 @@ export default function Custom404() {
className="relative flex items-start space-x-4 py-6 rtl:space-x-reverse">
diff --git a/packages/features/shell/Shell.tsx b/packages/features/shell/Shell.tsx
index 9761ba15ae..5381ba6a13 100644
--- a/packages/features/shell/Shell.tsx
+++ b/packages/features/shell/Shell.tsx
@@ -73,11 +73,11 @@ import {
ChevronDown,
Copy,
Settings,
- Slack,
Users,
Zap,
User as UserIcon,
} from "@calcom/ui/components/icon";
+import { Discord } from "@calcom/ui/components/icon/Discord";
import FreshChatProvider from "../ee/support/lib/freshchat/FreshChatProvider";
import { NProgressNextRouter } from "./NProgressPageIndicator";
@@ -434,7 +434,7 @@ function UserDropdown({ small }: UserDropdownProps) {
}
+ StartIcon={(props) => }
target="_blank"
rel="noreferrer"
href={JOIN_DISCORD}>
diff --git a/packages/ui/components/icon/Discord.tsx b/packages/ui/components/icon/Discord.tsx
new file mode 100644
index 0000000000..3be3410d6a
--- /dev/null
+++ b/packages/ui/components/icon/Discord.tsx
@@ -0,0 +1,14 @@
+import React, { forwardRef } from "react";
+
+export const Discord = forwardRef>(function Discord(props, ref) {
+ return (
+
+ );
+});
diff --git a/packages/ui/package.json b/packages/ui/package.json
index 55c10e642c..0b2b27ff10 100644
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -7,7 +7,8 @@
"exports": {
".": "./index.tsx",
"./components/toast": "./components/toast/index.tsx",
- "./components/icon": "./components/icon/index.ts"
+ "./components/icon": "./components/icon/index.ts",
+ "./components/icon/Discord": "./components/icon/Discord.tsx"
},
"types": "./index.tsx",
"license": "MIT",