Add login and register and related stuff

.dockerignore

@@ -3,7 +3,6 @@
 .output
 node_modules
 .idea
-backend
 .git
 docker-compose.yml
-docker-compose.*.yml
+docker-compose.*.yml

.env.example

@@ -1,3 +1,3 @@
-API_URL="/api"
+API_URL=http://jobfair.fer.unizg.hr/api
 HOST=localhost
 PORT=3000

.eslintrc.js

@@ -28,6 +28,8 @@ module.exports = {
   // add your custom rules here
   rules: {
     "@typescript-eslint/consistent-type-definitions": [ "error", "type" ],
+    "@typescript-eslint/await-thenable": "off",
+    "@typescript-eslint/no-unsafe-assignment": "off",
     "@typescript-eslint/prefer-return-this-type": [ "warn" ],
     "@typescript-eslint/prefer-optional-chain": [ "warn" ],
     "@typescript-eslint/member-delimiter-style": [

.gitignore

@@ -107,3 +107,6 @@ sw.*
 !.docker/proxy
 docker-compose.override.yml
 docker-compose.*.override.yml
+
+# GraphQL artefacts
+graphql/schema.ts

app.vue

@@ -17,18 +17,22 @@
     <client-only>
       <cookie-consent />
     </client-only>
+
+    <client-only>
+      <translation-float
+        v-if="isLoggedIn"
+      />
+    </client-only>
   </div>
 </template>
 
 <script lang="ts">
   import {
+    computed,
     defineComponent,
     onMounted,
   } from "vue";
   import Toast from "primevue/toast";
-  import {
-    useClient,
-  } from "villus";
   import {
     useCookieConsentStore,
   } from "~/store/cookieConsent";
@@ -42,25 +46,38 @@
   import FacebookShareImage from "~/assets/images/share/facebook.png";
   import AppProgressBar from "~/components/nav/AppProgressBar.vue";
   import {
-    useRuntimeConfig,
+    useUserStore,
+  } from "~/store/user";
+  import {
+    useTranslationsStore,
+  } from "~/store/translations";
+  import {
+    useNuxtApp,
   } from "#app";
+  import TranslationFloat from "~/components/translation/translation-float.vue";
+  import {
+    useQuery,
+  } from "~/composables/useQuery";
+  import {
+    IInitialDataQuery,
+    IInitialDataQueryVariables,
+    InitialData,
+  } from "~/graphql/schema";
 
   export default defineComponent({
     components: {
+      TranslationFloat,
       AppProgressBar,
       CookieConsent,
       PToast: Toast,
     },
 
     inheritAttrs: false,
 
-    setup() {
-      const config = useRuntimeConfig();
-
-      useClient({
-        url: `${ config.API_BASE as string }/graphql`,
-        cachePolicy: "network-only",
-      });
+    async setup() {
+      const userStore = useUserStore();
+      const translationsStore = useTranslationsStore();
+      const nuxt = useNuxtApp();
 
       onMounted(() => {
         useCookieConsentStore().fetchConsent();
@@ -83,6 +100,32 @@
           }),
         ],
       });
+
+      const data = {
+        isLoggedIn: computed(() => userStore.isLoggedIn),
+      };
+
+      if (!nuxt.ssrContext) {
+        return data;
+      }
+
+      const initialData = await useQuery<IInitialDataQuery, IInitialDataQueryVariables>({
+        query: InitialData,
+        variables: {
+          language: translationsStore.currentLanguage,
+        },
+      })().catch(() => null);
+
+      if (!initialData) {
+        return;
+      }
+
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+      userStore.user = initialData.data?.profile ?? null;
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access,@typescript-eslint/no-unsafe-argument
+      translationsStore.setTranslations(initialData.data?.allTranslationsFor ?? []);
+
+      return data;
     },
   });
 </script>

assets/styles/theme/primevue/_base.scss

@@ -66,6 +66,28 @@ h6 {
 
 .pi {
   font-size: 1rem;
+  font-weight: 400;
+  font-style: normal;
+  font-variant: normal;
+  line-height: 1;
+  display: inline-block;
+  text-transform: none;
+  speak: none;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+
+  &::before {
+    content: "@";
+    pointer-events: none;
+    color: transparent;
+  }
+
+  &.pi-chevron-down {
+
+    &::before {
+      content: url("@/assets/images/util/arrow-down.svg?url");
+    }
+  }
 }
 
 .p-link {

codegen.yml

@@ -0,0 +1,15 @@
+overwrite: true
+schema: "./graphql/schema.graphql"
+documents: "./graphql/documents/**/*.graphql"
+generates:
+  ./graphql/schema.ts:
+    plugins:
+      - "typescript"
+      - "typescript-operations"
+      - "typescript-resolvers"
+      - "typescript-document-nodes"
+
+config:
+  typesPrefix: "I"
+  declarationKind: "type"
+  skipTypename: true