add sponsor buttons

oss-apps · Sep 6, 2024 · 43f5527 · 43f5527
1 parent 5abb5d5
commit 43f5527
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 2 deletions.
diff --git a/src/components/AddExpense/AddExpensePage.tsx b/src/components/AddExpense/AddExpensePage.tsx
@@ -7,7 +7,7 @@ import { SelectUserOrGroup } from './SelectUserOrGroup';
 import { AppDrawer, DrawerClose } from '../ui/drawer';
 import { Button } from '../ui/button';
 import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem } from '../ui/command';
-import { Banknote, CalendarIcon, Check } from 'lucide-react';
+import { Banknote, CalendarIcon, Check, HeartHandshakeIcon } from 'lucide-react';
 import { Input } from '../ui/input';
 import { SplitTypeSection } from './SplitTypeSection';
 import { Popover, PopoverContent, PopoverTrigger } from '../ui/popover';
@@ -413,6 +413,23 @@ export const AddExpensePage: React.FC<{ isStorageConfigured: boolean }> = ({
                 </div>
               </>
             )}
+            <div className="absolute bottom-[100px] mx-auto flex w-full justify-center">
+              <Link
+                href="https://github.com/sponsors/KMKoushik"
+                target="_blank"
+                className="rounded-full border border-pink-500 px-5"
+              >
+                <Button
+                  variant="ghost"
+                  className="text-md w-full justify-between px-0 hover:text-foreground/80"
+                >
+                  <div className="flex items-center gap-4">
+                    <HeartHandshakeIcon className="h-5 w-5 text-pink-500" />
+                    Sponsor us
+                  </div>
+                </Button>
+              </Link>
+            </div>
           </>
         )}
       </div>

diff --git a/src/pages/account.tsx b/src/pages/account.tsx
@@ -3,7 +3,16 @@ import MainLayout from '~/components/Layout/MainLayout';
 import { Button } from '~/components/ui/button';
 import Link from 'next/link';
 import { UserAvatar } from '~/components/ui/avatar';
-import { Bell, ChevronRight, Download, DownloadCloud, FileDown, Github, Star } from 'lucide-react';
+import {
+  Bell,
+  ChevronRight,
+  Download,
+  DownloadCloud,
+  FileDown,
+  Github,
+  HeartHandshakeIcon,
+  Star,
+} from 'lucide-react';
 import { signOut } from 'next-auth/react';
 import { AppDrawer } from '~/components/ui/drawer';
 import { SubmitFeedback } from '~/components/Account/SubmitFeedback';
@@ -99,6 +108,18 @@ const AccountPage: NextPageWithUser = ({ user }) => {
                 <ChevronRight className="h-6 w-6 text-gray-500" />
               </Button>
             </Link>
+            <Link href="https://github.com/sponsors/KMKoushik" target="_blank">
+              <Button
+                variant="ghost"
+                className="text-md w-full justify-between px-0 hover:text-foreground/80"
+              >
+                <div className="flex items-center gap-4">
+                  <HeartHandshakeIcon className="h-5 w-5 text-pink-600" />
+                  Sponsor us
+                </div>
+                <ChevronRight className="h-6 w-6 text-gray-500" />
+              </Button>
+            </Link>
             <SubmitFeedback />
             <SubscribeNotification />
             <Link href="https://www.producthunt.com/products/splitpro/reviews/new" target="_blank">