chore(sticker-catalogue,web-frontend): fix quarkus compose build issue and broken frontend in E2E tests (#214)

* chore: fix quarkus build issue

* chore: better fix quarkus build issue with full quarkus upgrade

* fix: broken UI breaking e2e tests

* fix: change UI to show betterer info in sidebar

Author: scottgerring

sticker-catalogue/pom.xml

@@ -18,7 +18,7 @@
         <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
         <quarkus.platform.artifact-id>quarkus-bom</quarkus.platform.artifact-id>
         <quarkus.platform.group-id>io.quarkus.platform</quarkus.platform.group-id>
-        <quarkus.platform.version>3.22.1</quarkus.platform.version>
+        <quarkus.platform.version>3.31.3</quarkus.platform.version>
         <skipITs>true</skipITs>
         <surefire-plugin.version>3.5.2</surefire-plugin.version>
         <checkstyle.version>10.18.2</checkstyle.version>
@@ -115,12 +115,12 @@
         <dependency>
             <groupId>io.quarkiverse.loggingjson</groupId>
             <artifactId>quarkus-logging-json</artifactId>
-            <version>3.2.0</version>
+            <version>3.4.1</version>
         </dependency>
 
         <dependency>
             <groupId>io.quarkus</groupId>
-            <artifactId>quarkus-junit5</artifactId>
+            <artifactId>quarkus-junit</artifactId>
             <scope>test</scope>
         </dependency>
         <dependency>
@@ -136,7 +136,7 @@
         </dependency>
         <dependency>
             <groupId>io.quarkus</groupId>
-            <artifactId>quarkus-junit5-mockito</artifactId>
+            <artifactId>quarkus-junit-mockito</artifactId>
             <scope>test</scope>
         </dependency>
 
@@ -224,6 +224,7 @@
                         <java.util.logging.manager>org.jboss.logmanager.LogManager</java.util.logging.manager>
                         <maven.home>${maven.home}</maven.home>
                     </systemPropertyVariables>
+                    <argLine>@{argLine}</argLine>
                 </configuration>
             </plugin>
             <plugin>
@@ -243,6 +244,7 @@
                         <java.util.logging.manager>org.jboss.logmanager.LogManager</java.util.logging.manager>
                         <maven.home>${maven.home}</maven.home>
                     </systemPropertyVariables>
+                    <argLine>@{argLine}</argLine>
                 </configuration>
             </plugin>
             <!-- Spotless Plugin for Code Formatting -->

sticker-catalogue/src/main/resources/application.properties

@@ -14,7 +14,7 @@ quarkus.log.json.fields.mdc.flat-fields=true
 quarkus.datasource.db-kind=postgresql
 
 # Hibernate ORM
-quarkus.hibernate-orm.database.generation=validate
+quarkus.hibernate-orm.schema-management.strategy=validate
 quarkus.hibernate-orm.log.sql=true
 
 # Flyway

sticker-catalogue/src/test/resources/application.properties

@@ -3,7 +3,7 @@ quarkus.datasource.db-kind=postgresql
 quarkus.datasource.devservices.enabled=true
 
 # Test Hibernate ORM configuration
-quarkus.hibernate-orm.database.generation=drop-and-create
+quarkus.hibernate-orm.schema-management.strategy=drop-and-create
 quarkus.hibernate-orm.log.sql=true
 
 # Disable Flyway for tests

web-frontend/src/App.jsx

@@ -7,7 +7,7 @@ import { datadogRum } from '@datadog/browser-rum';
 import "./App.css";
 
 function App() {
-  const { isAuthenticated, isLoading, user } = useAuth();
+  const { isAuthenticated, user } = useAuth();
   const navigate = useNavigate();
 
   if (isAuthenticated) {
@@ -18,18 +18,10 @@ function App() {
   }
 
   useEffect(() => {
-    if (!isLoading && isAuthenticated) {
+    if (isAuthenticated) {
       navigate("/dashboard");
     }
-  }, [isAuthenticated, isLoading, navigate]);
-
-  if (isLoading) {
-    return (
-      <div style={{ textAlign: "center", padding: "50px" }}>
-        <h2>Loading...</h2>
-      </div>
-    );
-  }
+  }, [isAuthenticated, navigate]);
 
   return (
     <div className="isolate flex flex-auto flex-col bg-[--root-bg]">

web-frontend/src/components/StickerDetail.jsx

@@ -4,32 +4,20 @@ import LocalPrintshopOutlinedIcon from "@mui/icons-material/LocalPrintshopOutlin
 import HeaderBar from "./HeaderBar";
 import Sidebar from "./Sidebar";
 import { API_BASE_URL } from "../config";
-import AuthService from "../services/AuthService";
 import { useAuth } from "../context/AuthContext";
 import { authFetch } from "../utils/authFetch";
 import { getLastActiveEvent } from "../services/eventStorage";
 
 function StickerDetail() {
   const { id } = useParams();
   const navigate = useNavigate();
-  const { user, isLoading: authLoading } = useAuth();
+  const { user } = useAuth();
   const [sticker, setSticker] = useState(null);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(null);
   const [isOwned, setIsOwned] = useState(false);
 
   useEffect(() => {
-    const userId = user?.sub || user?.email;
-
-    // Validate userId before fetching
-    if (!userId) {
-      if (!authLoading) {
-        setError('Unable to identify user. Please log in again.');
-        setLoading(false);
-      }
-      return;
-    }
-
     const controller = new AbortController();
 
     const fetchSticker = async () => {
@@ -47,20 +35,14 @@ function StickerDetail() {
         }
 
         const data = await response.json();
-        setSticker(data);
-
-        // Check if user owns this sticker
-        const awardsResponse = await authFetch(
-          `${API_BASE_URL}/api/awards/v1/assignments/${encodeURIComponent(userId)}`
-        );
-        if (awardsResponse.ok) {
-          const awardsData = await awardsResponse.json();
-          const assignments = awardsData.stickers || [];
-          setIsOwned(assignments.some((a) => a.stickerId === id));
+        if (!controller.signal.aborted) {
+          setSticker(data);
         }
       } catch (err) {
         console.error("Error fetching sticker:", err);
-        setError(err.message);
+        if (!controller.signal.aborted) {
+          setError(err.message);
+        }
       } finally {
         if (!controller.signal.aborted) {
           setLoading(false);
@@ -69,8 +51,35 @@ function StickerDetail() {
     };
 
     fetchSticker();
+    return () => controller.abort();
   }, [id]);
 
+  // Check ownership when user context is available
+  useEffect(() => {
+    const userId = user?.sub || user?.email;
+    if (!userId || !sticker) return;
+
+    const controller = new AbortController();
+
+    const checkOwnership = async () => {
+      try {
+        const awardsResponse = await authFetch(
+          `${API_BASE_URL}/api/awards/v1/assignments/${encodeURIComponent(userId)}`
+        );
+        if (awardsResponse.ok && !controller.signal.aborted) {
+          const awardsData = await awardsResponse.json();
+          const assignments = awardsData.stickers || [];
+          setIsOwned(assignments.some((a) => a.stickerId === id));
+        }
+      } catch (err) {
+        console.error("Error checking ownership:", err);
+      }
+    };
+
+    checkOwnership();
+    return () => controller.abort();
+  }, [id, user, sticker]);
+
   const formatDate = (dateString) => {
     if (!dateString) return "Unknown";
     return new Date(dateString).toLocaleDateString("en-US", {

web-frontend/src/components/UserInfo.jsx

@@ -28,9 +28,9 @@ function UserInfo() {
         <span className="block text-sm text-gray-600">
           {isLoading
             ? "..."
-            : user?.role?.length
-              ? user.role.join(", ")
-              : "No roles assigned"}
+            : user?.role?.includes("admin")
+              ? "Sticker Admin"
+              : "Sticker Collector"}
         </span>
       </div>
     </div>

web-frontend/src/context/AuthContext.jsx

@@ -119,6 +119,14 @@ export const AuthProvider = ({ children }) => {
     clearLoginError
   }
 
+  if (isLoading) {
+    return (
+      <div style={{ textAlign: 'center', padding: '50px' }}>
+        <h2>Loading...</h2>
+      </div>
+    )
+  }
+
   return (
     <AuthContext.Provider value={value}>
       {children}