chore(ci): enable caching

Reviewed-on: #40
Reviewed-by: Dominik <mail@dominikstahl.dev>

.github/workflows/container-scan.yml

@@ -15,7 +15,7 @@ jobs:
         uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4
 
       - name: Build an image from Dockerfile
-        run: docker build -t git.dominikstahl.dev/dhbw-we/meetup:${{ github.sha }} .
+        run: docker buildx build -t meetup_trivy .
 
       - name: Install Trivy
         run: |
@@ -23,8 +23,8 @@ jobs:
 
       - name: Run Trivy vulnerability scanner
         run: |
-          trivy image --exit-code 1 --severity HIGH,CRITICAL,MEDIUM --ignore-unfixed --no-progress --format table git.dominikstahl.dev/dhbw-we/meetup:${{ github.sha }}
-          trivy image --exit-code 1 --severity HIGH,CRITICAL,MEDIUM --ignore-unfixed --no-progress --format json git.dominikstahl.dev/dhbw-we/meetup:${{ github.sha }} > trivy-report.json
+          trivy image --exit-code 1 --severity HIGH,CRITICAL,MEDIUM --ignore-unfixed --no-progress --format table meetup_trivy
+          trivy image --exit-code 1 --severity HIGH,CRITICAL,MEDIUM --ignore-unfixed --no-progress --format json meetup_trivy > trivy-report.json
 
       - name: Upload Trivy report
         uses: forgejo/upload-artifact@v4
@@ -33,6 +33,5 @@ jobs:
 
       - name: Clean up Docker
         run: |
-          docker builder prune -af --keep-storage 2GB
-          docker rmi $(docker images --filter=reference="git.dominikstahl.dev/dhbw-we/meetup:*" -q)
-          docker image prune -f
+          docker buildx prune --filter=until=48h -f
+          docker image rm meetup_trivy

.github/workflows/docker-build.yml

@@ -45,6 +45,7 @@ jobs:
         with:
           push: true
           tags: git.dominikstahl.dev/${{ env.REPO }}:${{ steps.get-ref.outputs.tag}}
+          cache-from: type=registry,ref=git.dominikstahl.dev/${{ env.REPO }}:buildcache
 
       - name: Build and push (push_tag)
         uses: docker/build-push-action@14487ce63c7a62a4a324b0bfb37086795e31c6c1 # v6
@@ -52,6 +53,7 @@ jobs:
         with:
           push: true
           tags: git.dominikstahl.dev/${{ env.REPO }}:${{ steps.get-ref.outputs.tag }},git.dominikstahl.dev/${{ env.REPO }}:latest
+          cache-from: type=registry,ref=git.dominikstahl.dev/${{ env.REPO }}:buildcache
 
       - name: Build and push (push_branch)
         uses: docker/build-push-action@14487ce63c7a62a4a324b0bfb37086795e31c6c1 # v6
@@ -59,8 +61,9 @@ jobs:
         with:
           push: true
           tags: git.dominikstahl.dev/${{ env.REPO }}:${{ steps.get-ref.outputs.tag }}
+          cache-from: type=registry,ref=git.dominikstahl.dev/${{ env.REPO }}:buildcache
+          cache-to: type=registry,ref=git.dominikstahl.dev/${{ env.REPO }}:buildcache,mode=max
 
       - name: Clean up Docker
         run: |
-          docker builder prune -af --keep-storage 2GB
-          docker image prune -f
+          docker buildx prune --filter=until=48h -f

.yarnrc.yml

@@ -0,0 +1 @@
+nodeLinker: node-modules

Dockerfile

@@ -4,13 +4,15 @@ FROM node:22-alpine@sha256:ad1aedbcc1b0575074a91ac146d6956476c1f9985994810e4ee02
 FROM base AS deps
 
 WORKDIR /app
-COPY package.json yarn.lock ./
+RUN corepack enable
+COPY package.json yarn.lock .yarnrc.yml ./
 RUN yarn install --frozen-lockfile
 
 # ----- Build -----
 FROM base AS builder
 
 WORKDIR /app
+RUN corepack enable
 COPY --from=deps /app/node_modules ./node_modules
 COPY . .
 RUN yarn build

next.config.ts

@@ -2,6 +2,16 @@ import type { NextConfig } from 'next';
 
 const nextConfig: NextConfig = {
   output: 'standalone',
+  images: {
+    remotePatterns: [
+      {
+        protocol: 'https',
+        hostname: 'img1.wikia.nocookie.net',
+        port: '',
+        pathname: '/**',
+      },
+    ],
+  },
 };
 
 export default nextConfig;

package.json

@@ -15,6 +15,7 @@
     "@fortawesome/free-regular-svg-icons": "^6.7.2",
     "@fortawesome/free-solid-svg-icons": "^6.7.2",
     "@fortawesome/react-fontawesome": "^0.2.2",
+    "@radix-ui/react-hover-card": "^1.1.13",
     "@radix-ui/react-slot": "^1.2.2",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
@@ -42,5 +43,5 @@
     "tw-animate-css": "1.2.9",
     "typescript": "5.8.3"
   },
-  "packageManager": "yarn@1.22.22+sha1.ac34549e6aa8e7ead463a7407e1c7390f61a6610"
+  "packageManager": "yarn@4.9.1"
 }

src/app/login/page.tsx

@@ -2,9 +2,16 @@ import { auth } from '@/auth';
 import SSOLogin from '@/components/user/sso-login-button';
 import LoginForm from '@/components/user/login-form';
 import { redirect } from 'next/navigation';
+import { Button } from '@/components/ui/button';
+import Image from 'next/image';
 
 import '@/app/globals.css';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import {
+  HoverCard,
+  HoverCardTrigger,
+  HoverCardContent,
+} from '@/components/ui/hover-card';
 
 export default async function LoginPage() {
   const session = await auth();
@@ -15,20 +22,35 @@ export default async function LoginPage() {
 
   return (
     <div className='flex flex-col items-center justify-center h-screen'>
-      <Card className='w-[350px] max-w-screen'>
-        <CardHeader>
-          <CardTitle className='text-lg text-center'>Login</CardTitle>
-        </CardHeader>
-        <CardContent className='gap-6 flex flex-col'>
-          <LoginForm />
+      <div className='flex flex-col items-center justify-center h-screen'>
+        <Card className='w-[350px] max-w-screen'>
+          <CardHeader>
+            <CardTitle className='text-lg text-center'>Login</CardTitle>
+          </CardHeader>
+          <CardContent className='gap-6 flex flex-col'>
+            <LoginForm />
 
-          <hr />
+            <hr />
 
-          {process.env.AUTH_AUTHENTIK_ISSUER && (
-            <SSOLogin provider='authentik' providerDisplayName='SSO' />
-          )}
-        </CardContent>
-      </Card>
+            {process.env.AUTH_AUTHENTIK_ISSUER && (
+              <SSOLogin provider='authentik' providerDisplayName='SSO' />
+            )}
+          </CardContent>
+        </Card>
+      </div>
+      <HoverCard>
+        <HoverCardTrigger className='text-sm text-muted-foreground hover:underline'>
+          <Button variant='link'>made with love</Button>
+        </HoverCardTrigger>
+        <HoverCardContent className='flex items-center justify-center'>
+          <Image
+            src='https://img1.wikia.nocookie.net/__cb20140808110649/clubpenguin/images/a/a1/Action_Dance_Light_Blue.gif'
+            width='150'
+            height='150'
+            alt='dancing penguin'
+          ></Image>
+        </HoverCardContent>
+      </HoverCard>
     </div>
   );
 }

src/components/ui/hover-card.tsx

@@ -0,0 +1,44 @@
+'use client';
+
+import * as React from 'react';
+import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
+
+import { cn } from '@/lib/utils';
+
+function HoverCard({
+  ...props
+}: React.ComponentProps<typeof HoverCardPrimitive.Root>) {
+  return <HoverCardPrimitive.Root data-slot='hover-card' {...props} />;
+}
+
+function HoverCardTrigger({
+  ...props
+}: React.ComponentProps<typeof HoverCardPrimitive.Trigger>) {
+  return (
+    <HoverCardPrimitive.Trigger data-slot='hover-card-trigger' {...props} />
+  );
+}
+
+function HoverCardContent({
+  className,
+  align = 'center',
+  sideOffset = 4,
+  ...props
+}: React.ComponentProps<typeof HoverCardPrimitive.Content>) {
+  return (
+    <HoverCardPrimitive.Portal data-slot='hover-card-portal'>
+      <HoverCardPrimitive.Content
+        data-slot='hover-card-content'
+        align={align}
+        sideOffset={sideOffset}
+        className={cn(
+          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',
+          className,
+        )}
+        {...props}
+      />
+    </HoverCardPrimitive.Portal>
+  );
+}
+
+export { HoverCard, HoverCardTrigger, HoverCardContent };