Add X social icon

components/auth/external-auth-button.tsx

@@ -3,14 +3,14 @@ import { type LucideIcon } from "lucide-react"
 import { signIn } from "next-auth/react"
 import { useCallback, useMemo, useState } from "react"
 
-import { GoogleIcon } from "@/components/icons/social"
+import { GoogleSocialIcon } from "@/components/icons/social"
 import { Spinner } from "@/components/spinner"
 import { Button } from "@/components/ui/button"
 
 const PROVIDERS = {
   google: {
     name: "Google",
-    icon: GoogleIcon as LucideIcon
+    icon: GoogleSocialIcon as LucideIcon
   },
   github: {
     name: "GitHub",

components/icons/social/google-icon.tsx

@@ -1,6 +1,6 @@
 import { type SVGProps } from "react"
 
-export function GoogleIcon(props: SVGProps<SVGSVGElement>) {
+export function GoogleSocialIcon(props: SVGProps<SVGSVGElement>) {
   return (
     <svg fill="none" viewBox="0 0 24 24" {...props}>
       <path

components/icons/social/index.ts

@@ -1 +1,2 @@
 export * from "./google-icon"
+export * from "./x-icon"

components/icons/social/x-icon.tsx

@@ -0,0 +1,17 @@
+import { type SVGProps } from "react"
+
+export function XSocialIcon(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      fill="none"
+      stroke="currentColor"
+      strokeWidth={2}
+      viewBox="0 0 24 24"
+      {...props}
+    >
+      <polygon points="2.07 2 7.04 2 21.93 22 16.96 22 2.07 2" />
+      <line x1="10.4" x2="2.24" y1="13.19" y2="22" />
+      <line x1="20.76" x2="13.15" y1="2" y2="10.21" />
+    </svg>
+  )
+}

components/layout/footer.tsx

@@ -1,6 +1,7 @@
-import { GithubIcon, TwitterIcon } from "lucide-react"
+import { GithubIcon } from "lucide-react"
 import Link from "next/link"
 
+import { XSocialIcon } from "@/components/icons/social"
 import { ThemePicker } from "@/components/theme-picker"
 import { Button } from "@/components/ui/button"
 import { siteConfig } from "@/config"
@@ -12,9 +13,9 @@ const navigation = [
     icon: GithubIcon
   },
   {
-    name: "Twitter",
+    name: "X",
     href: siteConfig.links.twitter,
-    icon: TwitterIcon
+    icon: XSocialIcon
   }
 ]