Solvro · qamarq · Feb 9, 2025 · Feb 9, 2025
diff --git a/frontend/next-sitemap.config.js b/frontend/next-sitemap.config.js
@@ -2,4 +2,16 @@
 export default {
   siteUrl: "https://planer.solvro.pl",
   generateRobotsTxt: true,
+  robotsTxtOptions: {
+    policies: [
+      {
+        userAgent: "*",
+        allow: "/",
+      },
+      {
+        userAgent: "*",
+        disallow: ["/plans", "/api"],
+      },
+    ],
+  },
 };
diff --git a/frontend/src/app/(homepage)/_components/github-repo.tsx b/frontend/src/app/(homepage)/_components/github-repo.tsx
@@ -0,0 +1,101 @@
+import { Icons } from "@/components/icons";
+import { AvatarCircles } from "@/components/magicui/avatars";
+import { Button } from "@/components/ui/button";
+import { env } from "@/env.mjs";
+
+export async function GithubRepo() {
+  let stars = 0;
+  let contributorsCount = 0;
+  const contributors: {
+    name: string;
+    avatar: string;
+    id: number;
+    contributions: number;
+  }[] = [];
+
+  const responseStars = await fetch(
+    "https://api.github.com/repos/Solvro/web-planer",
+    {
+      headers:
+        env.GITHUB_TOKEN == null
+          ? {}
+          : {
+              Authorization: `Bearer ${env.GITHUB_TOKEN}`,
+              "Content-Type": "application/json",
+            },
+      next: {
+        revalidate: 3600,
+      },
+    },
+  );
+
+  if (responseStars.ok) {
+    const data = (await responseStars.json()) as { stargazers_count: number };
+    stars = data.stargazers_count;
+  }
+
+  const responseContributors = await fetch(
+    "https://api.github.com/repos/Solvro/web-planer/contributors",
+    {
+      headers:
+        env.GITHUB_TOKEN == null
+          ? {}
+          : {
+              Authorization: `Bearer ${env.GITHUB_TOKEN}`,
+              "Content-Type": "application/json",
+            },
+      next: {
+        revalidate: 3600,
+      },
+    },
+  );
+
+  if (responseContributors.ok) {
+    const data = (await responseContributors.json()) as {
+      login: string;
+      avatar_url: string;
+      id: number;
+      contributions: number;
+    }[];
+    contributorsCount = data.length;
+    for (const contributor of data) {
+      contributors.push({
+        name: contributor.login,
+        avatar: contributor.avatar_url,
+        id: contributor.id,
+        contributions: contributor.contributions,
+      });
+    }
+  }
+  return (
+    <>
+      <div className="mx-auto space-y-4 pb-6 text-center">
+        <h2 className="font-mono text-sm font-medium uppercase tracking-wider text-primary">
+          autorzy
+        </h2>
+        <h1 className="relative z-10 mx-auto mt-4 max-w-xs text-3xl font-semibold sm:max-w-none sm:text-4xl md:text-5xl">
+          <span className="relative whitespace-nowrap text-white">
+            <span className="absolute -left-[5%] -top-[2.5%] z-0 h-[110%] w-[110%] -rotate-1 bg-blue-400/20 dark:bg-blue-200/10"></span>
+            <span className="relative z-10 text-blue-600 dark:text-blue-400">
+              {contributorsCount} developerów
+            </span>
+          </span>
+          <span className="relative z-10"> tworzy ten projekt</span>
+        </h1>
+      </div>
+      <div className="mt-2 flex flex-col items-center justify-center">
+        <AvatarCircles contributors={contributors} />
+        <Icons.FlexyArrow className="mt-12" />
+        <Button
+          className="group mt-4 bg-primary text-white ring-amber-500 ring-offset-2 transition-all hover:bg-blue-600 hover:ring-2 dark:bg-white dark:text-black dark:hover:bg-slate-200"
+          size={"lg"}
+        >
+          <Icons.Github className="size-4" />
+          Walnij nam gwiazdkę
+          <Icons.StarFilledIcon className="text-slate-300 transition-all group-hover:text-amber-500 dark:text-slate-600" />
+          {stars}
+        </Button>
+      </div>
+    </>
+  );
+}
diff --git a/frontend/src/app/(homepage)/login/page.tsx b/frontend/src/app/(homepage)/login/page.tsx
diff --git a/frontend/src/app/(homepage)/page.tsx b/frontend/src/app/(homepage)/page.tsx
@@ -17,6 +17,7 @@ import PWrLogoColor from "../../../public/assets/logo/pwr_color.png";
 import PWrLogoMono from "../../../public/assets/logo/pwr_mono.png";
 import HeroImageDark from "../../../public/assets/planer-dark.png";
 import HeroImageLight from "../../../public/assets/planer-light.png";
+import { GithubRepo } from "./_components/github-repo";
 
 const features = [
   {
@@ -113,6 +114,8 @@ const JoinUsBlock = async () => {
     const usos = await createUsosService();
     await usos.getProfile();
 
+    throw new Error("User is logged in");
+
     return (
       <div className="flex items-center justify-center gap-3">
         <Button
@@ -128,7 +131,7 @@ const JoinUsBlock = async () => {
     );
   } catch {
     return (
-      <div className="flex items-center justify-center gap-3">
+      <div className="flex flex-col items-center justify-center gap-3 md:flex-row">
         <Button
           className="animate-fade-in-2 opacity-0 [--animation-delay:500ms]"
           asChild={true}
@@ -222,6 +225,13 @@ export default function Home() {
             />
           </div>
         </div>
+        <Particles
+          className="absolute inset-0 -z-10 animate-fade-up opacity-0 [--animation-delay:400ms]"
+          quantity={80}
+          ease={40}
+          color={"#2f81f5"}
+          refresh
+        />
       </section>
       <section
         id="clients"
@@ -362,13 +372,13 @@ export default function Home() {
         </div>
       </section>
 
-      <Particles
-        className="absolute inset-0 -z-10 animate-fade-up opacity-0 [--animation-delay:400ms]"
-        quantity={80}
-        ease={40}
-        color={"#2f81f5"}
-        refresh
-      />
+      <section>
+        <div className="container relative mx-auto max-w-7xl px-4 py-16">
+          <Suspense>
+            <GithubRepo />
+          </Suspense>
+        </div>
+      </section>
     </main>
   );
 }
diff --git a/frontend/src/components/footer.tsx b/frontend/src/components/footer.tsx
@@ -1,6 +1,6 @@
 export function Footer() {
   return (
-    <footer className="mt-12 md:mt-0">
+    <footer className="mt-12 border-t md:mt-0">
       <p className="p-4 text-center font-medium text-black dark:text-white">
         Made with ❤️ by{" "}
         <a

diff --git a/frontend/src/components/icons.tsx b/frontend/src/components/icons.tsx
@@ -1,3 +1,4 @@
+import { StarFilledIcon } from "@radix-ui/react-icons";
 import {
   AlertTriangle,
   BellRingIcon,
@@ -14,6 +15,7 @@ import {
   EllipsisVertical,
   Fingerprint,
   GitPullRequestClosed,
+  Github,
   Link,
   Loader2Icon,
   Lock,
@@ -42,6 +44,8 @@ import {
 } from "lucide-react";
 import Image from "next/image";
 
+import { cn } from "@/lib/utils";
+
 import LogoColor from "../../public/assets/logo/logo_solvro_color.png";
 import LogoWhite from "../../public/assets/logo/logo_solvro_mono.png";
 
@@ -88,6 +92,7 @@ export const Icons = {
   GitPullRequestClosed,
   RefreshCwOff,
   Star,
+  StarFilledIcon,
   StarHalf,
   UsersRound,
   X,
@@ -102,4 +107,25 @@ export const Icons = {
   Check,
   Bug,
   Menu,
+  Github,
+  FlexyArrow: ({ className }: { className?: string }) => (
+    <svg
+      width="91"
+      height="195"
+      viewBox="0 0 91 195"
+      fill="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+      className={cn(
+        "size-20 text-blue-600 transition-transform duration-300",
+        className,
+      )}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M83.8275 2.83924C71.2259 10.0664 63.6462 14.9471 55.0809 21.3765C41.8223 31.3725 31.6613 40.3126 29.0565 44.3251C27.6954 46.4604 27.32 47.7744 27.4373 50.074C27.5546 52.4439 28.2821 53.9222 30.2533 55.729C33.8671 59.061 40.4143 61.2901 54.4943 63.9417C58.9764 64.7864 60.9476 65.42 60.9476 65.9831C60.9476 66.5463 58.6948 69.3151 56.6767 71.2392C54.0719 73.75 51.1855 76.0261 45.6239 79.9916C37.6687 85.6466 34.313 88.5797 31.3797 92.4984C29.2442 95.2907 28.2352 97.5433 28.1413 99.6551C28.0005 102.377 28.7983 104.067 30.8869 105.381C33.1397 106.812 34.2895 107 42.761 107.328C52.6873 107.704 53.0628 107.844 51.115 110.543C50.6223 111.247 47.9471 113.992 45.178 116.667C40.2501 121.407 38.0677 123.777 35.6037 127.062C33.7263 129.573 29.9248 135.439 26.5221 141.024C18.4027 154.399 16.5957 158.575 12.2309 173.804C11.48 176.432 10.7995 178.567 10.7056 178.567C10.424 178.567 10.0486 177.324 9.79044 175.447C9.3915 172.725 7.98349 167.375 7.30295 165.967C6.62242 164.535 5.87149 163.878 4.6043 163.55C2.72697 163.034 0.708845 164.23 0.145647 166.154C-0.112485 166.952 -0.0420511 167.75 0.474214 171.364C0.826212 173.71 1.20167 176.948 1.34247 178.567C1.92913 186.146 2.0934 187.648 2.39846 189.244C2.77393 191.285 3.36058 192.482 4.44004 193.514C6.05924 195.063 8.28857 195.415 10.3771 194.43C11.0342 194.148 12.536 192.975 13.7563 191.848C16.8773 188.986 20.3035 186.452 34.4303 176.573C43.066 170.542 45.9055 168.477 46.3983 167.914C46.7268 167.492 46.5156 167.07 46.0228 167.07C45.53 167.07 33.5386 171.786 29.6197 173.522C27.9301 174.273 25.0906 175.611 23.2837 176.549C21.4768 177.465 19.928 178.239 19.8341 178.286C19.7403 178.333 19.7637 178.075 19.8576 177.699C24.5509 162.94 26.0293 159.608 33.6324 146.726C41.8223 132.858 43.9812 129.807 50.7396 122.721C55.034 118.192 56.9348 115.775 58.1081 113.359C58.8121 111.857 58.9529 111.294 59.0233 109.534C59.1172 107.586 59.0937 107.375 58.3897 105.944C57.1694 103.456 54.9636 101.931 51.6314 101.251C50.7631 101.086 48.041 100.805 45.577 100.664C41.0949 100.406 37.2463 100.054 36.4954 99.8194C35.9557 99.6551 36.1669 99.2562 38.0677 96.7924C40.4613 93.7185 43.1364 91.3251 50.0356 86.1159C55.2687 82.1738 58.0612 79.8273 60.666 77.1993C67.0489 70.7465 68.9497 65.6546 66.2041 62.4399C64.5379 60.5158 62.778 59.8353 55.1983 58.2866C43.77 55.9636 37.7391 53.8753 34.9701 51.3176C33.304 49.7924 33.6325 48.713 36.7535 45.4044C44.6852 37.004 59.9855 24.4504 75.6142 13.4923C85.6814 6.42936 89.4595 3.47279 90.14 1.99451C90.5155 1.22017 90.5154 1.10285 90.1869 0.563162C89.9522 0.234654 89.5768 0 89.2717 0C88.9901 0 86.5496 1.29056 83.8275 2.83924Z"
+        fill="currentColor"
+      ></path>
+    </svg>
+  ),
 };
diff --git a/frontend/src/components/magicui/avatars.tsx b/frontend/src/components/magicui/avatars.tsx
@@ -0,0 +1,56 @@
+"use client";
+
+import Link from "next/link";
+
+import { cn } from "@/lib/utils";
+
+import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/tooltip";
+
+/* eslint-disable react/no-array-index-key */
+/* eslint-disable @typescript-eslint/restrict-template-expressions */
+/* eslint-disable @next/next/no-img-element */
+
+interface Contributor {
+  name: string;
+  avatar: string;
+  id: number;
+  contributions: number;
+}
+interface AvatarCirclesProps {
+  className?: string;
+  contributors: Contributor[];
+}
+
+export function AvatarCircles({ className, contributors }: AvatarCirclesProps) {
+  return (
+    <div className={cn("z-10 flex -space-x-4 rtl:space-x-reverse", className)}>
+      {contributors.map((contributor, index) => (
+        <Tooltip key={contributor.id}>
+          <TooltipTrigger asChild={true}>
+            <Link
+              href={`https://github.com/${contributor.name}`}
+              target="_blank"
+              className="relative -mx-0.5 transition-all hover:z-10 hover:scale-125"
+              rel="noopener noreferrer"
+            >
+              <img
+                key={index}
+                className="h-16 w-16 rounded-full border-2 border-white dark:border-gray-800"
+                src={contributor.avatar}
+                width={64}
+                height={64}
+                alt={`Avatar ${index + 1}`}
+              />
+            </Link>
+          </TooltipTrigger>
+          <TooltipContent align="center" side="top">
+            <div>
+              <h1 className="font-semibold">@{contributor.name}</h1>
+              <p>{contributor.contributions} contributions</p>
+            </div>
+          </TooltipContent>
+        </Tooltip>
+      ))}
+    </div>
+  );
+}
diff --git a/frontend/src/env.mjs b/frontend/src/env.mjs
@@ -12,6 +12,7 @@ export const env = createEnv({
     FORMS_FIELD_EMAIL: z.string().default("entry.1234567890"),
     FORMS_FIELD_TITLE: z.string().default("entry.1234567890"),
     FORMS_FIELD_DESCRIPTION: z.string().default("entry.1234567890"),
+    GITHUB_TOKEN: z.string().optional(),
   },
   client: {
     NEXT_PUBLIC_API_URL: z.string().url(),
@@ -26,6 +27,7 @@ export const env = createEnv({
     FORMS_FIELD_EMAIL: process.env.FORMS_FIELD_EMAIL,
     FORMS_FIELD_TITLE: process.env.FORMS_FIELD_TITLE,
     FORMS_FIELD_DESCRIPTION: process.env.FORMS_FIELD_DESCRIPTION,
+    GITHUB_TOKEN: process.env.GITHUB_TOKEN,
   },
   skipValidation: process.env.SKIP_ENV_VALIDATION === "true",
 });