Amend backend port in nginx

Update OpenAPI
Add ImportModal Add local proxy setting
2025-07-17 13:00:20 +02:00 · 2025-07-17 13:00:06 +02:00
63 changed files with 257 additions and 627 deletions
--- a/docker/docker-compose.yml
+++ b/docker/docker-compose.yml
@@ -7,16 +7,16 @@ services:
    depends_on:
      - db
    environment:
-      QUARKUS_DATASOURCE_JDBC_URL:
-      QUARKUS_DATASOURCE_USERNAME:
-      QUARKUS_DATASOURCE_PASSWORD:
-      QUARKUS_OIDC_AUTH_SERVER_URL:
-      QUARKUS_OIDC_CLIENT_ID:
-      QUARKUS_OIDC_CREDENTIALS_SECRET:
-      QUARKUS_OIDC_TOKEN_AUDIENCE:
-      QUARKUS_OIDC_TOKEN_ISSUER:
+      QUARKUS_DATASOURCE_JDBC_URL: jdbc:postgresql://db:5432/dex
+      QUARKUS_DATASOURCE_USERNAME: dex
+      QUARKUS_DATASOURCE_PASSWORD: dex
+      QUARKUS_OIDC_AUTH_SERVER_URL: https://auth.smoothbrain.win/application/o/dex-be/
+      QUARKUS_OIDC_CLIENT_ID: wUSuMpZlbop44mij54Mshxuf4CMuXdR9h1Jv9Ixc
+      QUARKUS_OIDC_CREDENTIALS_SECRET: CY8i3LM5mqHRUKAie6EscEi8fteiehYgy0FC2HtY79U1TxhRcCde9FfFB3m05DYvOTqI4xufRmspI5N5uqzgXkAljoe7BTjXw1Hhgxz0e5KH0K1jADhpO5a4lczoifjl
+      QUARKUS_OIDC_TOKEN_AUDIENCE: K202NAqkgfjceLZr28gAVQgJDc6RjZfdrE1jNx0K,wUSuMpZlbop44mij54Mshxuf4CMuXdR9h1Jv9Ixc
+      QUARKUS_OIDC_TOKEN_ISSUER: https://auth.smoothbrain.win/application/o/dex/
      QUARKUS_HTTP_INSECURE_REQUESTS: enabled
-      DEX_FILE_PATH:
+      DEX_FILE_PATH: /data/files
    networks:
      - dex

@@ -25,7 +25,7 @@ services:
      context: ..
      dockerfile: docker/Dockerfile
    ports:
-      - "80:80"
+      - "7070:7070"
    depends_on:
      - be
    environment:
--- a/docker/entrypoint.sh
+++ b/docker/entrypoint.sh
@@ -1,13 +1,15 @@
 #!/bin/sh
 set -e

+: "${API_HOST:=http://localhost}"
+: "${API_PORT:=7070}"
 # Create runtime config file in writable location
-#cat > /runtime-config/config.js <<EOF
-#window.__APP_CONFIG__ = {
-#  API_HOST: "${API_HOST}",
-#  API_PORT: "${API_PORT}"
-#};
-#EOF
+cat > /runtime-config/config.js <<EOF
+window.__APP_CONFIG__ = {
+  API_HOST: "${API_HOST}",
+  API_PORT: "${API_PORT}"
+};
+EOF

 # Generate nginx config from template (if using)
 if [ -f "/etc/nginx/templates/nginx.conf.template" ]; then
--- a/index.html
+++ b/index.html
@@ -1,6 +1,7 @@
 <!doctype html>
 <html lang="en">
  <head>
+    <script src="/config.js"></script>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
--- a/nginx.conf.template
+++ b/nginx.conf.template
@@ -32,7 +32,7 @@ http {
    }

    server {
-        listen 80;
+        listen 7070;
        server_name localhost;
        root /usr/share/nginx/html;
        index index.html;
@@ -57,21 +57,22 @@ http {
        }

        location /api/ {
-            # Proxy to Quarkus
-            proxy_pass         http://backend;
-            proxy_http_version 1.1;
-            proxy_set_header   Host              $host;
-            proxy_set_header   X-Real-IP         $remote_addr;
-            proxy_set_header   X-Forwarded-For   $proxy_add_x_forwarded_for;
-            proxy_set_header   X-Forwarded-Proto $scheme;
-            proxy_set_header   Upgrade           $http_upgrade;
-            proxy_set_header   Connection        "upgrade";
+            proxy_pass http://backend:8080/;

-            # Relay CORS headers from the backend
-            proxy_pass_header  Access-Control-Allow-Origin;
-            proxy_pass_header  Access-Control-Allow-Methods;
-            proxy_pass_header  Access-Control-Allow-Headers;
-            proxy_pass_header  Access-Control-Allow-Credentials;
+            # Headers for both simple and preflight requests
+            add_header 'Access-Control-Allow-Origin' '$http_origin' always;
+            add_header 'Access-Control-Allow-Credentials' 'true' always;
+            add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;
+            add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type' always;
+            add_header 'Access-Control-Expose-Headers' 'Authorization' always;
+
+            # Handle OPTIONS directly
+            if ($request_method = 'OPTIONS') {
+                add_header 'Access-Control-Max-Age' 1728000;
+                add_header 'Content-Type' 'text/plain; charset=UTF-8';
+                add_header 'Content-Length' 0;
+                return 204;
+            }
        }

        # Cache static assets
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
  "name": "dex-ui-vue",
-  "version": "0.0.14",
+  "version": "0.0.7",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
  "name": "dex-ui-vue",
  "private": true,
-  "version": "0.0.14",
+  "version": "0.0.7",
  "type": "module",
  "scripts": {
    "dev": "vite",
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex flex-col size-full">
+  <div class="flex flex-col size-dvh">
    <!-- Navigator here -->
    <Menubar
        :model="items"
@@ -32,13 +32,14 @@
        </div>
      </template>
    </Menubar>
-    <main class="app-main w-full pt-[60px]">
+    <main class="app-main pt-[60px]">
      <Toast/>
      <RouterView/>
+      <ImportModal
+          :visible="importModalVisibility"
+          @update:visible="importModalVisibility = false"
+      />
    </main>
-    <footer class="fixed bottom-0 right-0">
-      v{{ version }}
-    </footer>
  </div>
 </template>

@@ -47,11 +48,11 @@ import {ref} from "vue";
 import {useRouter} from "vue-router";
 import Toast from 'primevue/toast';
 import {useAuthStore} from "./stores/auth.ts";
-// noinspection ES6UnusedImports Used in template
-import { version } from '../package.json'
+import ImportModal from "@/components/ImportModal.vue";

 const authStore = useAuthStore();
 const router = useRouter();
+const importModalVisibility = ref(false);

 const items = ref([
  {
@@ -88,6 +89,11 @@ const items = ref([
    command: () => {
      router.push('/jobs');
    }
+  },
+  {
+    label: 'Import Set',
+    icon: 'pi pi-mobile',
+    command: () => importModalVisibility.value = true
  }
 ]);
 </script>
--- a/src/api/openapi/api.ts
+++ b/src/api/openapi/api.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/base.ts
+++ b/src/api/openapi/base.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/common.ts
+++ b/src/api/openapi/common.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/configuration.ts
+++ b/src/api/openapi/configuration.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/index.ts
+++ b/src/api/openapi/index.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/attribute.ts
+++ b/src/api/openapi/model/attribute.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/card-page-search-request.ts
+++ b/src/api/openapi/model/card-page-search-request.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/card-print.ts
+++ b/src/api/openapi/model/card-print.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/card-type.ts
+++ b/src/api/openapi/model/card-type.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/card-upstream-fetch-request.ts
+++ b/src/api/openapi/model/card-upstream-fetch-request.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/card.ts
+++ b/src/api/openapi/model/card.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/deck-create-request.ts
+++ b/src/api/openapi/model/deck-create-request.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/deck.ts
+++ b/src/api/openapi/model/deck.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/job-dto.ts
+++ b/src/api/openapi/model/job-dto.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/job-status.ts
+++ b/src/api/openapi/model/job-status.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/job-type.ts
+++ b/src/api/openapi/model/job-type.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/link-arrow.ts
+++ b/src/api/openapi/model/link-arrow.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/monster-card-sub-type.ts
+++ b/src/api/openapi/model/monster-card-sub-type.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/monster-card-type.ts
+++ b/src/api/openapi/model/monster-card-type.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/monster-card.ts
+++ b/src/api/openapi/model/monster-card.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/monster-type.ts
+++ b/src/api/openapi/model/monster-type.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/page-card-dto.ts
+++ b/src/api/openapi/model/page-card-dto.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/page-card-print-dto.ts
+++ b/src/api/openapi/model/page-card-print-dto.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/page-deck-dto.ts
+++ b/src/api/openapi/model/page-deck-dto.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/page-job-dto.ts
+++ b/src/api/openapi/model/page-job-dto.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/page-set-dto.ts
+++ b/src/api/openapi/model/page-set-dto.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/page.ts
+++ b/src/api/openapi/model/page.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/region-code-alias.ts
+++ b/src/api/openapi/model/region-code-alias.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/region.ts
+++ b/src/api/openapi/model/region.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/regional-set.ts
+++ b/src/api/openapi/model/regional-set.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/set-dto.ts
+++ b/src/api/openapi/model/set-dto.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/spell-card-type.ts
+++ b/src/api/openapi/model/spell-card-type.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/spell-card.ts
+++ b/src/api/openapi/model/spell-card.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/trap-card-type.ts
+++ b/src/api/openapi/model/trap-card-type.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/model/trap-card.ts
+++ b/src/api/openapi/model/trap-card.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/service/card-print-service.ts
+++ b/src/api/openapi/service/card-print-service.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/service/card-service.ts
+++ b/src/api/openapi/service/card-service.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/service/deck-service.ts
+++ b/src/api/openapi/service/deck-service.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/service/job-service.ts
+++ b/src/api/openapi/service/job-service.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/api/openapi/service/set-service.ts
+++ b/src/api/openapi/service/set-service.ts
@@ -4,7 +4,7 @@
 * dex API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
- * The version of the OpenAPI document: 0.0.6
+ * The version of the OpenAPI document: 0.0.5
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
--- a/src/auth/oidcConfig.ts
+++ b/src/auth/oidcConfig.ts
@@ -1,16 +1,13 @@
 import type {UserManagerSettings} from "oidc-client-ts";

-const redirectUri = import.meta.env.PROD
-    ? "https://dex.smoothbrain.win"
-    : "http://localhost:5173";
-
 export const oidcConfig : UserManagerSettings = {
  authority: 'https://auth.smoothbrain.win/application/o/dex/',
  client_id: 'K202NAqkgfjceLZr28gAVQgJDc6RjZfdrE1jNx0K',
-  redirect_uri: `${redirectUri}/callback`,
+  redirect_uri: 'http://localhost:5173/callback',
  response_type: 'code',
  scope: 'openid profile email',
-  post_logout_redirect_uri: redirectUri,
+  post_logout_redirect_uri: 'http://localhost:5173', // Homepage URL
+  // automaticSilentRenew: true,
  loadUserInfo: true,
  automaticSilentRenew: true,
  extraQueryParams: {
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -11,26 +11,21 @@ declare module 'vue' {
    Avatar: typeof import('primevue/avatar')['default']
    Badge: typeof import('primevue/badge')['default']
    Button: typeof import('primevue/button')['default']
-    Card: typeof import('primevue/card')['default']
-    CardAttributes: typeof import('./components/CardAttributes.vue')['default']
    CardFilterPanel: typeof import('./components/CardFilterPanel.vue')['default']
    CardListComponent: typeof import('./components/CardListComponent.vue')['default']
    CardListExpansion: typeof import('./components/CardListExpansion.vue')['default']
-    CardSetImportModal: typeof import('./components/CardSetImportModal.vue')['default']
    CardTable: typeof import('./components/CardTable.vue')['default']
    Carousel: typeof import('primevue/carousel')['default']
    Column: typeof import('primevue/column')['default']
    CustomTag: typeof import('./components/CustomTag.vue')['default']
    DataTable: typeof import('primevue/datatable')['default']
-    DataView: typeof import('primevue/dataview')['default']
    Dialog: typeof import('primevue/dialog')['default']
    Divider: typeof import('primevue/divider')['default']
    DynamicAsset: typeof import('./components/DynamicAsset.vue')['default']
    Fieldset: typeof import('primevue/fieldset')['default']
    FloatLabel: typeof import('primevue/floatlabel')['default']
    Image: typeof import('primevue/image')['default']
-    InputGroup: typeof import('primevue/inputgroup')['default']
-    InputGroupAddon: typeof import('primevue/inputgroupaddon')['default']
+    ImportModal: typeof import('./components/ImportModal.vue')['default']
    InputNumber: typeof import('primevue/inputnumber')['default']
    InputText: typeof import('primevue/inputtext')['default']
    LinkArrowsComponent: typeof import('./components/LinkArrowsComponent.vue')['default']
@@ -46,6 +41,5 @@ declare module 'vue' {
    SplitButton: typeof import('primevue/splitbutton')['default']
    Tag: typeof import('primevue/tag')['default']
    Textarea: typeof import('primevue/textarea')['default']
-    TreeTable: typeof import('primevue/treetable')['default']
  }
 }
--- a/src/components/CardAttributes.vue
+++ b/src/components/CardAttributes.vue
@@ -1,56 +0,0 @@
-<template>
-  <div class="flex flex-wrap gap-4 justify-center">
-    <Tag
-        :value="card.cardType"
-        :severity="getCardSeverity(card.cardType)"
-    />
-    <template v-if="isMonsterCard(card)">
-      <Tag
-          v-if="card.isPendulum"
-          value="PENDULUM"
-          :severity="getSeverityFromMonsterCardType(card.type)"
-      />
-      <Tag
-          :value="card.type"
-          :severity="getSeverityFromMonsterCardType(card.type)"
-      />
-      <Tag
-          v-for="subType in card.subTypes"
-          :value="subType"
-          severity="secondary"
-      />
-    </template>
-    <template v-if="isSpellCard(card)">
-      <Tag
-          :value="card.type"
-          :severity="getSeverityFromSpellCardType(card.type)"
-      />
-    </template>
-    <template v-if="isTrapCard(card)">
-      <Tag
-          :value="card.type"
-          :severity="getSeverityFromTrapCardType(card.type)"
-      />
-    </template>
-  </div>
-</template><
-
-<script setup lang="ts">
-import type {Ref} from "vue";
-import type {Card} from "@/api/openapi";
-import {
-  getCardSeverity,
-  getSeverityFromMonsterCardType, getSeverityFromSpellCardType, getSeverityFromTrapCardType,
-  isMonsterCard,
-  isSpellCard,
-  isTrapCard
-} from "@/util/card-type-util.ts";
-
-const card: Ref<Card> = defineModel({
-  required: true
-})
-</script>
-
-<style scoped>
-
-</style>>`
--- a/src/components/CardFilterPanel.vue
+++ b/src/components/CardFilterPanel.vue
@@ -2,8 +2,10 @@

  <Panel>
    <ScrollPanel
+        class="w-full"
        style="height: 800px"
    >
+
      <FloatLabel variant="on" class="my-2">
        <InputText
            fluid
--- a/src/components/CardSetImportModal.vue
+++ b/src/components/CardSetImportModal.vue
@@ -1,74 +1,83 @@
 <template>
  <Dialog
+      v-model:visible="visible"
+      @update:visible="$emit('update:visible', visible)"
      modal
+      header="Edit Profile"
+      :style="{ width: '25rem' }"
      :draggable="false"
-      :dismissable-mask="true"
-      :visible="visible"
-      @update:visible="emit('update:visible', $event)"
  >
    <template #header>
      <div class="inline-flex items-center justify-center gap-2">
        <span class="font-bold whitespace-nowrap">Import Set</span>
      </div>
    </template>
-    <span class="text-surface-500 dark:text-surface-400 block mb-8">Import a Set by its name</span>
    <div class="flex items-center gap-4 mb-4">
      <label for="setName" class="font-semibold w-24">Set Name</label>
-      <InputText id="setName" class="flex-auto" autocomplete="off" v-model="cardSetName"/>
+      <InputText id="setName" v-model="cardSetName" class="flex-auto" autocomplete="off" />
    </div>
    <template #footer>
-      <Button label="Cancel" text severity="secondary" @click="visible = false"/>
-      <Button label="Import" outlined severity="secondary" @click="importSet(cardSetName)"/>
+      <Button label="Cancel" text severity="secondary" @click="visible = false" autofocus />
+      <Button
+          label="Import"
+          :disabled="!cardSetName"
+          outlined
+          severity="primary"
+          @click="startSetScrapeJob(cardSetName)"
+          autofocus
+      />
    </template>
  </Dialog>
 </template>

 <script setup lang="ts">
 import {inject, ref, type Ref, watch} from "vue";
-import {SetService} from "@/api/openapi";
 import {SetServiceKey} from "@/main.ts";
+import {SetService} from "@/api/openapi";
 import {useToast} from "primevue";

-const toast = useToast();
 const emit = defineEmits(['update:visible'])
+const toast = useToast();
+const loading: Ref<boolean> = ref(false);
 const visible: Ref<boolean> = defineModel("visible", {
  required: true
 })

-const setService: SetService = inject(SetServiceKey) as SetService;
-const cardSetName: Ref<string | null> = ref(null);
+const cardSetName: Ref<string | null> = ref(null)

-const importSet = async(name: string | null) => {
+const setService: SetService = inject(SetServiceKey) as SetService
+
+const startSetScrapeJob = async (name: string | null) => {
  if (!name) {
-    toast.add({
-      severity: "warn",
-      summary: `Name of Set is required to import`,
-    })
    return;
  }

+  loading.value = true;
  try {
    await setService.scrapeSetByName({
-      name: name,
-    });
+      name: name
+    })

    toast.add({
      severity: "info",
-      summary: `Import Job for Set '${cardSetName.value}' was started successfully`,
+      detail: `Import Job for '${cardSetName}' has been started'`
    })
-  } catch (ex: unknown) {
+  } catch (e) {
    toast.add({
      severity: "error",
-      summary: `Error occurred trying to import Set '${cardSetName.value}'`,
+      detail: "Error occurred trying to import CardSet - see logs for details"
    })
  } finally {
-    cardSetName.value = null;
-    visible.value = false
+    loading.value = false;
+    visible.value = false;
+    emit('update:visible', visible)
  }
 }

-watch(visible, () => {
+watch(visible, (newValue: boolean) => {
+  if (!newValue) {
    cardSetName.value = null;
+  }
 })
 </script>

--- a/src/main.ts
+++ b/src/main.ts
@@ -26,9 +26,8 @@ import {useAuthStore} from "./stores/auth.ts";
 import SetsView from "./views/set/SetsView.vue";
 import JobsView from "./views/JobsView.vue";
 import {definePreset} from "@primeuix/themes";
-import {getConfig, initConfig} from "@/util/config.ts";
+import {getApiUrl, getConfig, initConfig} from "@/util/config.ts";
 import axios from "axios";
-import CreateDeckView from "@/views/deck/CreateDeckView.vue";

 // Initialize configuration from window object
 initConfig((window as any).__APP_CONFIG__ || {})
@@ -114,8 +113,7 @@ const routes: RouteRecordRaw[] = [
  {path: '/', component: HomeView},
  {path: '/cards', component: CardsView, meta: {requiresAuth: false}},
  {path: '/cards/:id', component: CardView, meta: {requiresAuth: true}},
-  {path: '/decks', component: DecksView, meta: {requiresAuth: false}},
-  {path: '/decks/create', component: CreateDeckView, meta: {requiresAuth: true}},
+  {path: '/decks', component: DecksView, meta: {requiresAuth: true}},
  {path: '/decks/:id', component: DeckView, meta: {requiresAuth: true}},
  {path: '/sets', component: SetsView},
  {path: '/sets/:id', component: DeckView, meta: {requiresAuth: true}},
@@ -136,18 +134,19 @@ router.beforeEach(async (to) => {
      return false;
    }
  }
-  return true;
 })

 app.use(router);
 app.use(ToastService)

-const apiUrl = import.meta.env.PROD
-    ? "/"
-    : `http://${getConfig().API_HOST}:${getConfig().API_PORT}`;
+let apiUrl: string | undefined
+
+const devProxy = import.meta.env.DEV && !import.meta.env.VITE_API_HOST && !import.meta.env.VITE_API_PORT
+    ? ''
+    : `http://${getApiUrl()}`

 const axiosInstance = axios.create({
-  baseURL: apiUrl,
+  baseURL: devProxy,
  headers: {
    'Content-Type': 'application/json'
  }
@@ -172,6 +171,7 @@ axiosInstance.interceptors.response.use(
    }
 )

+console.log(apiUrl)
 const deckService: DeckService = new DeckService(undefined, undefined, axiosInstance)
 const cardService: CardService = new CardService(undefined, undefined, axiosInstance)
 const setService: SetService = new SetService(undefined, undefined, axiosInstance)
--- a/src/style.css
+++ b/src/style.css
@@ -5,7 +5,6 @@
 body {
  font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
  font-size: 14px;
-  width: 100%;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
--- a/src/util/card-type-util.ts
+++ b/src/util/card-type-util.ts
@@ -24,14 +24,6 @@ export const isMonsterCard = (card: Card): card is MonsterCard => {
  return card.cardType === "MONSTER"
 }

-export const isSpellCard = (card: Card): card is SpellCard => {
-  return card.cardType === "SPELL"
-}
-
-export const isTrapCard = (card: Card): card is TrapCard => {
-  return card.cardType === "TRAP"
-}
-
 export const getMonsterCardType = (monsterCard: MonsterCard) => {
  return `${monsterCard.type} MONSTER `
 }
--- a/src/util/config.ts
+++ b/src/util/config.ts
@@ -18,3 +18,10 @@ export function initConfig(config: Partial<AppConfig>) {
 export function getConfig(): AppConfig {
  return runtimeConfig;
 }
+
+export function getApiUrl() {
+  if (!runtimeConfig.API_HOST) {
+    return null;
+  }
+  return `${runtimeConfig.API_HOST}:${runtimeConfig.API_PORT}`;
+}
--- a/src/views/Callback.vue
+++ b/src/views/Callback.vue
@@ -16,7 +16,7 @@ onMounted(async () => {
    await router.push('/'); // Redirect to home after login
  } catch (error) {
    console.error('Login callback error:', error);
-    await router.push('/'); // Handle errors
+    await router.push('/error'); // Handle errors
  }
 });
 </script>
--- a/src/views/JobsView.vue
+++ b/src/views/JobsView.vue
@@ -30,7 +30,7 @@

 <script setup lang="ts">

-import {type JobDto, JobService, JobType} from "@/api/openapi";
+import {type JobDto, JobService, JobType} from "../api/openapi";
 import {inject, onMounted, type Ref, ref} from "vue";
 import {JobServiceKey} from "../main.ts";

--- a/src/views/card/CardsView.vue
+++ b/src/views/card/CardsView.vue
@@ -1,7 +1,9 @@
 <template>
-  <div class="flex">
-    <Panel class="w-[50%] m-4">
+  <div class="flex w-full min-h-content">
+    <Panel class="w-full m-4">
      <DataTable
+          class="my-4 ml-4 w-full"
+          tableStyle="min-width: 50rem"
          dataKey="id"
          paginator
          lazy
@@ -42,21 +44,33 @@
            <!--        <Avatar image="https://upload.wikimedia.org/wikipedia/en/2/2b/Yugioh_Card_Back.jpg" class="mr-2" size="xlarge" shape="circle" />-->
          </template>
        </Column>
-        <Column header="Name">
+        <Column field="name" header="Name">
          <template #body="slotProps">
-            <div class="w-[50%]">
-              <p class="font-bold text-center">
+            <p class="font-bold">
              {{slotProps.data.name}}
            </p>
-              <p class="text-muted-color text-center" v-if="isMonsterCard(slotProps.data)">
-                {{ slotProps.data.monsterType}}
-              </p>
-            </div>
          </template>
        </Column>
-        <Column header="Attributes" class="w-[20%]">
+        <Column header="Card Type" filter>
          <template #body="slotProps">
-            <CardAttributes v-model="slotProps.data"/>
+            <Tag
+                :value="slotProps.data.cardType"
+                :severity="getCardSeverity(slotProps.data.cardType)"
+            ></Tag>
+          </template>
+        </Column>
+        <Column header="Type">
+          <template #body="slotProps">
+            <Tag
+                v-if="slotProps.data.type !== 'FUSION'"
+                :value="slotProps.data.type"
+                :severity="getCardTypeSeverity(slotProps.data)"
+            />
+            <CustomTag
+                v-else
+                color="purple"
+                :value="slotProps.data.type"
+            />
          </template>
        </Column>
        <template #expansion="slotProps">
@@ -67,17 +81,17 @@

    <CardFilterPanel
        v-model="filters"
-        class="fixed right-0 w-content m-4 h-content"
+        class="fixed right-0 w-[42%] m-4"
    />
  </div>
 </template>

 <script setup lang="ts">
-import CardFilterPanel from "@/components/CardFilterPanel.vue";
-import {isMonsterCard} from "@/util/card-type-util.ts";
-import {type Card, CardService, type CardServiceGetCardPageRequest} from "@/api/openapi";
+import CardFilterPanel from "../../components/CardFilterPanel.vue";
+import {getCardTypeSeverity, getCardSeverity} from "../../util/card-type-util.ts";
+import {type Card, CardService, type CardServiceGetCardPageRequest} from "../../api/openapi";
 import {inject, onMounted, ref, type Ref, watch} from "vue";
-import {CardServiceKey} from "@/main.ts";
+import {CardServiceKey} from "../../main.ts";
 import type {
  DataTableFilterEvent,
  DataTablePageEvent,
@@ -85,7 +99,7 @@ import type {
  DataTableSortEvent
 } from "primevue";
 import {useDebounceFn} from "@vueuse/core";
-import type {MutableCardRequest} from "@/api/mutableTypes.ts";
+import type {MutableCardRequest} from "../../api/mutableTypes.ts";

 const cardService: CardService = inject(CardServiceKey) as CardService;

@@ -129,7 +143,7 @@ const filters: Ref<MutableCardRequest> = ref({
  pageCount: 10
 })

-const getCardPage = async (filters: CardServiceGetCardPageRequest): Promise<void> => {
+const getGetCardPage = async (filters: CardServiceGetCardPageRequest): Promise<void> => {
  loading.value = true;
  const cardPage = (await cardService.getCardPage(filters)).data

@@ -142,7 +156,7 @@ const getCardPage = async (filters: CardServiceGetCardPageRequest): Promise<void
 const handlePaging = async (e: DataTablePageEvent) => {
  filters.value.page = e.page;
  filters.value.pageSize = e.rows
-  await getCardPage(filters.value)
+  await getGetCardPage(filters.value)
 }

 const handleSorting = (_: DataTableSortEvent) => {
@@ -158,13 +172,13 @@ const handleRowSelect = (e: DataTableRowSelectEvent) => {
  console.log(JSON.stringify(e.data))
 }

-const debouncedGetCardPage = useDebounceFn(getCardPage, 150)
+const debouncedGetCardPage = useDebounceFn(getGetCardPage, 150)

 watch(filters, async (newFiltersValue) => {
  await debouncedGetCardPage(newFiltersValue)
 })

 onMounted(async () => {
-  await getCardPage(filters.value)
+  await getGetCardPage(filters.value)
 })
 </script>
--- a/src/views/deck/CreateDeckView.vue
+++ b/src/views/deck/CreateDeckView.vue
@@ -1,283 +0,0 @@
-<template>
-  <div class="flex gap-4 m-4">
-
-    <div class="flex flex-col gap-4 min-w-[40%]">
-      <Panel
-          header="Main Deck"
-          class="bg-primary-950 min-h-60"
-          @dragover.prevent
-          @drop="onDropToMainDeck"
-      >
-        <DataView
-            :value="mainDeck"
-            :pt="{
-            content: {
-              class: 'bg-inherit'
-            }
-          }"
-        >
-          <template #list="slotProps">
-            <div class="flex flex-col">
-              <div v-for="(card, index) in slotProps.items" :key="index">
-                <Card
-                    :draggable="true"
-                    class="text-lg font-medium mt-2"
-                    @dragstart="onDragStart(card, 'deck')"
-                >
-                  <template #content>
-                    {{ card.name }}
-                    <Button @click="removeFromDeck(card)">Remove</Button>
-                  </template>
-                </Card>
-              </div>
-            </div>
-          </template>
-          <template #empty>
-            Nope
-          </template>
-        </DataView>
-      </Panel>
-
-      <Panel
-          header="Extra Deck"
-          class="bg-indigo-950 min-h-60"
-          @dragover.prevent
-          @drop="onDropToExtraDeck"
-      >
-        <DataTable
-            :value="extraDeck"
-            :pt="{
-              emptyMessage: {
-                  class: 'bg-indigo-950'
-              },
-              column: {
-                headerCell: {
-                  class: 'bg-indigo-950 text-center'
-                },
-                columnHeaderContent: {
-                  class: 'justify-center'
-                }
-              },
-              bodyRow: {
-                class: 'bg-indigo-950 justify-center'
-              }
-            }"
-        >
-          <Column field="name" header="Card"/>
-          <Column header="Quantity" class="w-46">
-            <template #body>
-              <InputGroup class="w-full">
-                <InputGroupAddon>
-                  <Button icon="pi pi-minus" severity="primary"/>
-                </InputGroupAddon>
-                <InputNumber :model-value="1"/>
-                <InputGroupAddon>
-                  <Button icon="pi pi-plus" severity="primary"/>
-                </InputGroupAddon>
-              </InputGroup>
-            </template>
-          </Column>
-          <template #empty>
-            <div>
-              drag cards here senpai
-            </div>
-          </template>
-        </DataTable>
-      </Panel>
-
-      <Panel
-          header="Side Deck"
-          class="bg-slate-800 min-h-50"
-          @dragover.prevent
-          @drop="onDropToSideDeck"
-      >
-        <DataView
-            :value="sideDeck"
-            :pt="{
-            content: {
-              class: 'bg-inherit'
-            }
-          }"
-        >
-          <template #list="slotProps">
-            <div class="flex flex-col">
-              <div v-for="(card, index) in slotProps.items" :key="index" class="flex flex-wrap">
-                <Card
-                    :draggable="true"
-                    class="text-lg font-medium mt-2 w-full"
-                    @dragstart="onDragStart(card, 'deck')"
-                >
-                  <template #content>
-                    <div class="flex justify-between items-center gap-4">
-                      <p>
-                        {{ card.name }}
-                      </p>
-                      <InputGroup class="w-36">
-                        <InputGroupAddon>
-                          <Button icon="pi pi-minus" severity="primary"/>
-                        </InputGroupAddon>
-                        <InputNumber :model-value="1"/>
-                        <InputGroupAddon>
-                          <Button icon="pi pi-plus" severity="primary"/>
-                        </InputGroupAddon>
-                      </InputGroup>
-                    </div>
-                  </template>
-                </Card>
-              </div>
-            </div>
-          </template>
-          <template #empty>
-            Nope
-          </template>
-        </DataView>
-      </Panel>
-    </div>
-
-
-    <Panel
-        header="Available Cards"
-        class="w-[50%] fixed right-0"
-        @dragover.prevent
-        @drop="onDropToPool"
-    >
-      <DataView :value="availableCards">
-        <template #list="slotProps">
-          <div class="flex flex-col">
-            <div v-for="(card, index) in slotProps.items" :key="index">
-              <Card
-                  :draggable="true"
-                  class="text-lg font-medium mt-2"
-                  @dragstart="onDragStart(card, 'pool')"
-              >
-                <template #content>
-                  {{ card.name }}
-                </template>
-              </Card>
-            </div>
-          </div>
-        </template>
-      </DataView>
-    </Panel>
-
-  </div>
-</template>
-
-<script setup lang="ts">
-import {inject, onMounted, ref, type Ref} from "vue";
-import {SetServiceKey} from "@/main.ts";
-import {type Card, type SetDto, SetService} from "@/api/openapi";
-
-const setService = inject(SetServiceKey) as SetService
-const loading: Ref<boolean> = ref(false);
-const decks: Ref<SetDto[]> = ref([]);
-
-const page: Ref<number> = ref(0);
-const pageSize: Ref<number> = ref(20);
-const pageCount: Ref<number> = ref(0);
-const totalRecords: Ref<number> = ref(0);
-
-const getSetPage = async (page: number, pageSize: number): Promise<void> => {
-  loading.value = true;
-  const deckPage = (await setService.getCardSetPage({
-    page: page,
-    pageSize: pageSize
-  })).data
-
-  decks.value = deckPage.content
-  pageCount.value = deckPage.totalPages!!
-  totalRecords.value = deckPage.totalRecords!!
-  loading.value = false;
-}
-
-onMounted(async () => {
-  await getSetPage(
-      page.value,
-      pageSize.value
-  )
-})
-
-// ----
-// Initial card pool
-const mainDeck: Ref<Card[]> = ref([])
-const extraDeck: Ref<Card[]> = ref([])
-const sideDeck: Ref<Card[]> = ref([])
-
-const availableCards = ref([
-  {id: 1, name: 'Blue-Eyes White Dragon'},
-  {id: 2, name: 'Dark Magician'},
-  {id: 3, name: 'Red-Eyes Black Dragon'},
-  // ... more cards
-])
-
-// User's deck
-
-// Track the dragged card and its origin
-let draggedCard: Ref<Card | null> = ref(null)
-let originPool: Ref<string | null> = ref(null)
-
-function onDragStart(card: Card, from: string) {
-  draggedCard.value = card
-  originPool.value = from
-}
-
-function onDropToMainDeck() {
-  if (originPool.value === 'pool') {
-    // Prevent duplicates
-    if (draggedCard.value && !mainDeck.value.find(card => card.id === draggedCard.value?.id)) {
-      mainDeck.value.push(draggedCard.value)
-    }
-  } else if (originPool.value === 'deck') {
-    // Handle reordering within deck if desired
-    // For simplicity, no-op
-  }
-  resetDrag()
-}
-
-function onDropToExtraDeck() {
-  if (originPool.value === 'pool') {
-    // Prevent duplicates
-    if (draggedCard.value && !mainDeck.value.find(card => card.id === draggedCard.value?.id)) {
-      extraDeck.value.push(draggedCard.value)
-    }
-  } else if (originPool.value === 'deck') {
-    // Handle reordering within deck if desired
-    // For simplicity, no-op
-  }
-  resetDrag()
-}
-
-function onDropToSideDeck() {
-  if (originPool.value === 'pool') {
-    // Prevent duplicates
-    if (draggedCard.value && !mainDeck.value.find(card => card.id === draggedCard.value?.id)) {
-      sideDeck.value.push(draggedCard.value)
-    }
-  } else if (originPool.value === 'deck') {
-    // Handle reordering within deck if desired
-    // For simplicity, no-op
-  }
-  resetDrag()
-}
-
-function onDropToPool() {
-  if (originPool.value === 'deck') {
-    // Remove from deck and return to pool
-    mainDeck.value = mainDeck.value.filter(c => c.id !== draggedCard.value?.id)
-  }
-  resetDrag()
-}
-
-function removeFromDeck(cardToRemove: Card) {
-  mainDeck.value = mainDeck.value.filter(card => card.id !== cardToRemove.id)
-}
-
-function resetDrag() {
-  draggedCard.value = null
-  originPool.value = null
-}
-</script>
-
-<style scoped>
-
-</style>
--- a/src/views/deck/DecksView.vue
+++ b/src/views/deck/DecksView.vue
@@ -1,123 +1,73 @@
 <template>
-  <DataView :value="decks" :layout="layout">
-    <template #header>
-      <div class="flex justify-end gap-4">
-        <SelectButton v-model="layout" :options="layoutOptions" :allowEmpty="false">
-          <template #option="{ option }">
-            <i :class="[option === 'list' ? 'pi pi-bars' : 'pi pi-table']" />
-          </template>
-        </SelectButton>
-        <Button type="button" size="small" label="Build" icon="pi pi-plus" @click="router.push('/decks/create')"/>
-      </div>
-    </template>
-
-    <template #list="slotProps">
-      <div class="flex flex-col">
-        <div v-for="(item, index) in slotProps.items" :key="index">
-          <div class="flex flex-col sm:flex-row sm:items-center p-6 gap-4" :class="{ 'border-t border-surface-200 dark:border-surface-700': index !== 0 }">
-            <div class="md:w-40 relative">
-              <img class="block xl:block mx-auto rounded w-full" src="https://m.media-amazon.com/images/I/81H7zpRNyRL.jpg" alt="peepee poopoo" />
-            </div>
-            <div class="flex flex-col md:flex-row justify-between md:items-center flex-1 gap-6">
-              <div class="flex flex-row md:flex-col justify-between items-start gap-2">
-                <div>
-                  <span class="font-medium text-surface-500 dark:text-surface-400 text-sm">{{ item.category }}</span>
-                  <div class="text-lg font-medium mt-2">{{ item.name }}</div>
-                </div>
-                <div class="bg-surface-100 p-1" style="border-radius: 30px">
-                  <div class="bg-surface-0 flex items-center gap-2 justify-center py-1 px-2" style="border-radius: 30px; box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.04), 0px 1px 2px 0px rgba(0, 0, 0, 0.06)">
-                    <span class="text-surface-900 font-medium text-sm">{{ item.rating }}</span>
-                    <i class="pi pi-star-fill text-yellow-500"></i>
-                  </div>
-                </div>
-              </div>
-              <div class="flex flex-col md:items-end gap-8">
-                <span class="text-xl font-semibold">${{ item.price }}</span>
-                <div class="flex flex-row-reverse md:flex-row gap-2">
-                  <Button icon="pi pi-heart" outlined></Button>
-                  <Button icon="pi pi-shopping-cart" label="Buy Now" :disabled="item.inventoryStatus === 'OUTOFSTOCK'" class="flex-auto md:flex-initial whitespace-nowrap"></Button>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </template>
-
-    <template #grid="slotProps">
-      <div class="grid grid-cols-12 gap-4">
-        <div v-for="(deck, index) in slotProps.items" :key="index" class="col-span-12 sm:col-span-6 md:col-span-4 xl:col-span-6 p-2">
-          <div class="p-6 border border-surface-200 dark:border-surface-700 bg-surface-0 dark:bg-surface-900 rounded flex flex-col">
-            <div class="bg-surface-50 flex justify-center rounded p-4">
+  <div class="card">
+    <Carousel :value="decks" :numVisible="3" :numScroll="3">
+      <template #item="slotProps">
+        <div class="border border-surface-200 dark:border-surface-700 rounded m-2 p-4 w-96 h-auto">
+          <div class="mb-4">
            <div class="relative mx-auto">
-                <img class="rounded w-full" :src="`https://primefaces.org/cdn/primevue/images/product/${deck.image}`" :alt="deck.name" style="max-width: 300px"/>
-              </div>
-            </div>
-            <div class="pt-6">
-              <div class="flex flex-row justify-between items-start gap-2">
-                <div>
-                  <span class="font-medium text-surface-500 dark:text-surface-400 text-sm">[ARCHETYPE]</span>
-                  <div class="text-lg font-medium mt-1">{{ deck.name }}</div>
-                </div>
-                <div class="bg-surface-100 p-1" style="border-radius: 30px">
-                  <div class="bg-surface-0 flex items-center gap-2 justify-center py-1 px-2" style="border-radius: 30px; box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.04), 0px 1px 2px 0px rgba(0, 0, 0, 0.06)">
-                    <span class="text-surface-900 font-medium text-sm">5</span>
-                    <i class="pi pi-star-fill text-yellow-500"></i>
-                  </div>
-                </div>
-              </div>
-              <div class="flex flex-col gap-6 mt-6">
-                <span class="text-2xl font-semibold">50€</span>
-                <div class="flex gap-2">
-                  <Button icon="pi pi-shopping-cart" label="Buy Now" class="flex-auto whitespace-nowrap"></Button>
-                  <Button icon="pi pi-heart" outlined></Button>
-                </div>
+              <img
+                  :src="'https://upload.wikimedia.org/wikipedia/en/2/2b/Yugioh_Card_Back.jpg?20201122212343'"
+                  class="w-full rounded"
+                  alt="Deck"
+              />
            </div>
          </div>
+          <div class="flex justify-between ">
+            <p class="font-bold">
+              {{ slotProps.data.name }}
+            </p>
+            <Tag
+                value="[ARCHETYPE]"
+            />
          </div>
+          <div class="flex justify- items-center">
+            <SplitButton
+                label="View"
+                :model="deckMenuItems"
+                @click="viewDeck(slotProps.data.id)"
+            />
          </div>
        </div>
      </template>
-  </DataView>
+    </Carousel>
+  </div>
 </template>

 <script setup lang="ts">
-import {type Deck, DeckService} from "@/api/openapi";
+
+import {type Deck, DeckService} from "../../api/openapi";
+import {DeckServiceKey} from "../../main.ts";
 import {inject, onMounted, ref, type Ref} from "vue";
-import {DeckServiceKey} from "@/main.ts";
+import {useToast} from "primevue";
 import {useRouter} from "vue-router";

+const toast = useToast();
 const router = useRouter();
-
-const layout: Ref<"grid" | "list"> = ref('grid');
-const layoutOptions: Ref<string[]> = ref(['list', 'grid']);
-const loading: Ref<boolean> = ref(false);
 const deckService: DeckService = inject(DeckServiceKey) as DeckService;
-const decks: Ref<Deck[]> = ref([]);
+const decks: Ref<Deck[]> = ref([])

-const page: Ref<number> = ref(0);
-const pageSize: Ref<number> = ref(20);
-const pageCount: Ref<number> = ref(0);
-const totalRecords: Ref<number> = ref(0);
+const deckMenuItems = [
+  {
+    label: 'Edit',
+    command: () => {
+      toast.add({
+        severity: 'info',
+        summary: 'Not Implemented',
+        detail: 'Deck Editing isn\'t implemented yet',
+        life: 3000
+      });
+    }
+  },
+]

-const getDeckPage = async (page: number, pageSize: number): Promise<void> => {
-  loading.value = true;
-  const deckPage = (await deckService.getDecks({
-    page: page,
-    pageSize: pageSize
-  })).data
-
-  decks.value = deckPage.content
-  pageCount.value = deckPage.totalPages!!
-  totalRecords.value = deckPage.totalRecords!!
-  loading.value = false;
+const viewDeck = (deckId: number) => {
+  router.push(`/decks/${deckId}`);
 }

 onMounted(async () => {
-  await getDeckPage(
-      page.value,
-      pageSize.value
-  )
+  const decksResponse = await deckService.getDecks()
+
+  decks.value = decksResponse.data.content
 })
 </script>

--- a/src/views/set/SetsView.vue
+++ b/src/views/set/SetsView.vue
@@ -1,8 +1,4 @@
 <template>
-  <CardSetImportModal
-    :visible="importModalVisible"
-    @update:visible="args => importModalVisible = args"
-  />
  <DataTable
      tableStyle="min-width: 50rem"
      dataKey="id"
@@ -20,11 +16,6 @@
      @page="handlePaging"
      @sort="handleSorting"
  >
-    <template #header>
-      <div class="flex justify-end">
-        <Button type="button" size="small" label="Import" icon="pi pi-download" @click="importModalVisible = true"/>
-      </div>
-    </template>
    <Column header="Image">
      <template #body>
        <Image alt="Image" preview class="h-64">
@@ -33,9 +24,7 @@
          </template>
          <template #image>
            <div class="overflow-hidden">
-              <img
-                  src="https://comicbook.com/wp-content/uploads/sites/4/2024/11/YuGiOh-Early-Days-Collection.png?resize=2000,1125"
-                  alt="image" width="650" height="650"/>
+              <img src="https://comicbook.com/wp-content/uploads/sites/4/2024/11/YuGiOh-Early-Days-Collection.png?resize=2000,1125" alt="image" width="650" height="650"/>
            </div>
          </template>
          <template #preview="slotProps">
@@ -57,8 +46,8 @@
      </template>
    </Column>
    <Column header="No. of Regional Sets">
-      <template #body>
-        N/A
+      <template #body="slotProps">
+        {{ slotProps.data.regionalSets.length }}
      </template>
    </Column>
    <template #footer> In total there are {{ sets ? sets.length : 0 }} Card Sets </template>
@@ -66,12 +55,11 @@
 </template>

 <script setup lang="ts">
-import {type SetDto, SetService} from "@/api/openapi";
+import {type SetDto, SetService} from "../../api/openapi";
 import {inject, onMounted, ref, type Ref} from "vue";
-import {SetServiceKey} from "@/main.ts";
+import {SetServiceKey} from "../../main.ts";
 import type {DataTablePageEvent, DataTableSortEvent} from "primevue";

-const importModalVisible: Ref<boolean> = ref(false);
 const setService: SetService = inject(SetServiceKey) as SetService;
 const loading: Ref<boolean> = ref(true);
 const sets: Ref<SetDto[]> = ref([])
@@ -84,16 +72,16 @@ const first = ref(0);

 const fetchCardSetPage = async (page: number, pageSize: number): Promise<void> => {
  loading.value = true;
-  const setPage = (await setService.getCardSetPage({
+  const cardPage = (await setService.getCardSetPage({
        name: null,
        page: page,
        pageSize: pageSize
      }
  )).data

-  sets.value = setPage.content
-  pageCount.value = setPage.totalPages!!
-  totalRecords.value = setPage.totalRecords!!
+  sets.value = cardPage.content
+  pageCount.value = cardPage.totalPages!!
+  totalRecords.value = cardPage.totalRecords!!
  loading.value = false;
 }

--- a/vite.config.ts
+++ b/vite.config.ts
@@ -24,6 +24,13 @@ export default defineConfig({
      '@': path.resolve(__dirname, './src'),
    }
  },
+  proxy: {
+    '/api': {
+      target: 'http://localhost:8080',
+      changeOrigin: true,
+      secure: false,
+    }
+  },
  build: {
    // @ts-ignore
    assetsInclude: [
Author	SHA1	Message	Date
Katarina	4ccbf959f8	Amend backend port in nginx	2025-07-17 13:00:20 +02:00
Katarina	80e2924e30	Update OpenAPI Add ImportModal Add local proxy setting	2025-07-17 13:00:06 +02:00