GH 3365 Add contributors page on twenty-website (#3745)

* add transition in mobile navbar

* add contributors listing page

* Add breadcrumb component

* Add profilecard component

* Make profile info dynamic

* Style activity log component

* Make title a re-usable component

* Make card container re-usable

* add rank and active days logic

* complete single contributor page

* add styles for mobile

* Add github link

* Reset header desktop

* update calendar height

* remove conditional header

* add GH PR link

* display 10 prs

* Remove employees and fix rank

* Unrelated CSS adjustment

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>

packages/twenty-website/src/app/developers/contributors/page.tsx

@@ -1,6 +1,9 @@
 import Database from 'better-sqlite3';
 
 import AvatarGrid from '@/app/components/AvatarGrid';
+import { Header } from '@/app/components/developers/contributors/Header';
+import { Background } from '@/app/components/oss-friends/Background';
+import { ContentContainer } from '@/app/components/oss-friends/ContentContainer';
 
 interface Contributor {
   login: string;
@@ -14,16 +17,19 @@ const Contributors = async () => {
   const contributors = db
     .prepare(
       `SELECT 
-          u.login,
-          u.avatarUrl, 
-          COUNT(pr.id) AS pullRequestCount
-        FROM 
+        u.login,
+        u.avatarUrl, 
+        COUNT(pr.id) AS pullRequestCount
+      FROM 
           users u
-        JOIN 
+      JOIN 
           pullRequests pr ON u.id = pr.authorId
-        GROUP BY 
+      WHERE 
+          u.isEmployee = FALSE
+      AND u.login NOT IN ('dependabot', 'cyborch', 'emilienchvt', 'Samox')
+      GROUP BY 
           u.id
-        ORDER BY 
+      ORDER BY 
           pullRequestCount DESC;
         `,
     )
@@ -32,9 +38,15 @@ const Contributors = async () => {
   db.close();
 
   return (
-    <div>
-      <AvatarGrid users={contributors} />
-    </div>
+    <>
+      <Background />
+      <ContentContainer>
+        <Header />
+        <div>
+          <AvatarGrid users={contributors} />
+        </div>
+      </ContentContainer>
+    </>
   );
 };