label_editor/frontend/app/store/labelEditorStore.ts

import {defineStore} from "pinia";
import type {Article} from "~/types/article";
import {NotificationMessage} from "~/types/notificationMessage";
import type {RuntimeConfig} from "nuxt/schema";
import {Origin} from "~/types/origin";
import type {Variant} from "~/types/variant";

interface State {
  config: RuntimeConfig,

  // UI
  descriptionMaxChars: number,
  ingredientsMaxChars: number,

  // Notification
  notifications: NotificationMessage[],
  notificationQueue: NotificationMessage[],

  // Article
  article: Article | null,

  origins: Array<Origin>,
}

export const useLabelEditorStore = defineStore('label_editor_store', {
  state: (): State => ({
    config: useRuntimeConfig(),

    // UI
    descriptionMaxChars: 256,
    ingredientsMaxChars: 256,

    // Notification
    notifications: [],
    notificationQueue: [],

    // Article
    article: null,

    origins: [
        Origin.EU,
        Origin.NonEU,
        Origin.EUnonEU
    ]
  }),
  actions: {
    // Notification
    addNotification(error: boolean, message: string) {
      const notification: NotificationMessage = new NotificationMessage(error, message);

      if (import.meta.client) {
        const localStoreNotification = localStorage.getItem("label_editor_notifications");

        if (localStoreNotification != null) {
          this.notifications = JSON.parse(localStoreNotification);
        }
      }

      this.notificationQueue.push(notification);
      this.notifications.push(notification);

      if (import.meta.client) {
        localStorage.setItem('label_editor_notifications', JSON.stringify(this.notifications));
      }

      if (notification.error) {
        setTimeout(() => this.removeNotification(notification.id), 5000);
      } else {
        setTimeout(() => this.removeNotification(notification.id), 2000);
      }
    },

    removeNotification(id: string) {
      const index = this.notificationQueue.findIndex(notification => notification.id == id);

      if (index > -1) {
        this.notificationQueue.splice(index, 1);
      }
    },

    getNotifications(): NotificationMessage[] {
      let oldNotifications: NotificationMessage[] = [];

      if (import.meta.client) {
        const localStoreNotification = localStorage.getItem("label_editor_notifications");

        if (localStoreNotification != null) {
          oldNotifications = JSON.parse(localStoreNotification);

          oldNotifications.reverse();
          return oldNotifications;
        }
      }

      return [];
    },

    clearNotifications() {
      this.notifications = [];

      if (import.meta.client) {
        localStorage.setItem('label_editor_notifications', JSON.stringify(this.notifications));
      }

      this.addNotification(false, "Benachrichtigungen gelöscht")
    },


    // Article
    async loadArticle(articleID: number) {
      try {
        const article: Article = await $fetch<Article>(this.config.public.url + '/article/' + articleID, {
          method: 'GET',
        });

        this.article = article;
        this.addNotification(false, 'Artikel geladen: ' + this.article.name);
      } catch {
        this.article = null;
        this.addNotification(true, 'Fehler beim laden des Artikel. ID:' + articleID);
      }
    },

    // TODO: Check if function from view can be replaced with store method
    async loadArticles(): Promise<Array<Article>> {
      console.log("Test");
      try {
        const articles: Array<Article> = await $fetch<Array<Article>>(this.config.public.url + '/articles', {
          method: 'GET',
        });

        this.addNotification(false, 'Artikelliste geladen');
        return articles;
      } catch {
        this.addNotification(true, 'Fehler beim laden der Artikeliste');
        return [];
      }
    },

    async createArticle(article: Article) {
      try {
        this.article = await $fetch<Article>(this.config.public.url + '/article', {
          method: 'POST',
          body: JSON.stringify(article),
        });

        this.addNotification(false, 'Artikel "' + article.name + '" erstellt');
      } catch {
        this.addNotification(true, 'Fehler beim erstellen des Artikel: ' + article.name);
      }
    },

    async updateArticle(article: Article) {
      if (this.article != null) {
        try {
          this.article = await $fetch<Article>(this.config.public.url + '/article/update', {
            method: 'POST',
            body: JSON.stringify(this.article),
          });

          this.addNotification(false, 'Artikel "' + this.article.name + '" aktualisiert');
        } catch {
          this.addNotification(true, 'Fehler beim aktualisieren des Artikel: ' + this.article.name);
        }
      } else {
        this.addNotification(true, 'Es ist kein Artikel ausgewählt');
      }
    },

    // Variant
    async addVariant(articleID: number, variant: Variant) {
      if(this.article != null) {
        try {
          let createdVariant = await $fetch<Variant>(this.config.public.url + '/article/' + articleID + '/variant', {
            method: 'POST',
            body: JSON.stringify(variant),
          });

          this.article.variants.push(createdVariant);

          this.addNotification(false, 'Variante erstellt.');
        } catch {
          this.addNotification(true, 'Fehler beim erstellen der Variante.');
        }
      } else {
        this.addNotification(true, 'Kann Variante nicht erstellen. Es ist kein Artikel ausgewählt.');
      }
    },
  },
});