robodev 0.11.0 → 0.13.0

package/templates/auth-chat/apps/fe/src/assets/locales/sl/translation.json

@@ -0,0 +1,202 @@
+{
+  "appName": "Auth chat",
+  "appDescription": "Skupni klepet s povabilom po e-pošti",
+  "shared": {
+    "notFound": {
+      "head": {
+        "title": "Stran ni bila najdena",
+        "description": "Stran, ki jo iščete, ne obstaja."
+      },
+      "heading": "Stran ni bila najdena",
+      "subheading": "Stran, ki jo iščete, ne obstaja.",
+      "homeBtn": "Na domačo stran"
+    },
+    "errorFallback": {
+      "heading": "Nekaj je šlo narobe",
+      "subheading": "Napaka: {{error}}",
+      "retryBtn": "Poskusi znova"
+    },
+    "apiErrors": {
+      "requestFailed": "Zahteva ni uspela: {{error}}",
+      "unknown": "Prišlo je do neznane napake."
+    },
+    "seedData": {
+      "actionButton": "Ponastavi začetne podatke",
+      "confirmation": {
+        "heading": "Ponastaviti začetne podatke?",
+        "description": "Vsi lokalni podatki bodo ponastavljeni na začetno stanje.",
+        "confirm": "Ponastavi",
+        "cancel": "Prekliči"
+      }
+    },
+    "actions": {
+      "back": "Nazaj"
+    },
+    "fakeMailbox": {
+      "title": "Lažni poštni predal",
+      "open": "Odpri lažni poštni predal",
+      "close": "Zapri lažni poštni predal",
+      "empty": "Ni prejetih e-poštnih sporočil.",
+      "from": "Od",
+      "to": "Za",
+      "cc": "Kp",
+      "bcc": "Skp",
+      "replyTo": "Odgovori na",
+      "openPopup": "Odpri pojavno okno",
+      "popupBlocked": {
+        "heading": "Pojavno okno e-pošte je blokirano",
+        "description": "Brskalnik je blokiral samodejno okno e-pošte. Dovolite pojavna okna za to stran ali sporočilo odprite zdaj.",
+        "open": "Odpri e-pošto",
+        "cancel": "Pusti neprebrano"
+      }
+    }
+  },
+  "auth": {
+    "wrapper": {
+      "title": "Administrativni portal",
+      "description": "Tiny",
+      "watermark": "© {{year}} Tiny • Razvija in vzdržuje Povio"
+    },
+    "shared": {
+      "errors": {
+        "invalidCredentials": "Neveljaven e-poštni naslov ali geslo.",
+        "userAlreadyExists": "Račun s tem e-poštnim naslovom že obstaja.",
+        "identityNotFound": "Tega računa ni bilo mogoče najti.",
+        "notConfirmed": "Ta račun še ni potrjen."
+      }
+    },
+    "login": {
+      "head": {
+        "title": "Prijava",
+        "description": "Prijavite se v svoj račun"
+      },
+      "form": {
+        "title": "Prijava",
+        "email": "E-pošta",
+        "emailPlaceholder": "Vnesite svoj e-poštni naslov",
+        "password": "Geslo",
+        "passwordPlaceholder": "Vnesite svoje geslo",
+        "submit": "Prijava",
+        "submitLoading": "Prijavljanje...",
+        "demoLogin": "Prijava kot demo uporabnik",
+        "noAccount": "Nimate računa?",
+        "registerLink": "Registracija",
+        "loginFailed": "Prijava ni uspela",
+        "resetSeedData": "Ponastavi začetne podatke"
+      },
+      "confirmations": {
+        "resetSeed": {
+          "heading": "Ponastaviti začetne podatke?",
+          "description": "Vsi lokalni podatki bodo ponastavljeni na začetno stanje.",
+          "confirm": "Ponastavi",
+          "cancel": "Prekliči"
+        }
+      }
+    },
+    "register": {
+      "head": {
+        "title": "Registracija",
+        "description": "Ustvarite nov račun"
+      },
+      "form": {
+        "title": "Registracija",
+        "description": "Ustvarite nov račun",
+        "email": "E-pošta",
+        "emailPlaceholder": "Vnesite svoj e-poštni naslov",
+        "name": "Ime",
+        "namePlaceholder": "Vnesite svoje ime",
+        "password": "Geslo",
+        "passwordPlaceholder": "Vnesite svoje geslo",
+        "confirmPassword": "Potrdite geslo",
+        "confirmPasswordPlaceholder": "Potrdite svoje geslo",
+        "confirmPasswordRequired": "Potrditev gesla je obvezna",
+        "passwordsDoNotMatch": "Gesli se ne ujemata",
+        "passwordRequirements": "Geslo mora vsebovati vsaj 12 znakov.",
+        "submit": "Registriraj se",
+        "registrationFailed": "Registracija ni uspela",
+        "hasAccount": "Že imate račun?",
+        "loginLink": "Prijava"
+      }
+    },
+    "setPassword": {
+      "form": {
+        "title": "Nastavite svoje geslo",
+        "welcome": "Dobrodošli, {{firstName}} {{lastName}}. Nastavite geslo, da dokončate nastavitev računa.",
+        "tokenNote": "Vnesite povabilni žeton, ki ste ga prejeli po e-pošti.",
+        "token": "Povabilni žeton",
+        "tokenPlaceholder": "Vnesite svoj povabilni žeton",
+        "tokenChecking": "Preverjanje žetona...",
+        "tokenError": "{{error}}",
+        "invalidToken": "Neveljaven ali potekel žeton",
+        "email": "E-pošta",
+        "password": "Geslo",
+        "passwordPlaceholder": "Vnesite svoje geslo",
+        "confirmPassword": "Potrdite geslo",
+        "confirmPasswordPlaceholder": "Potrdite svoje geslo",
+        "passwordRequirements": "Geslo mora vsebovati vsaj 8 znakov.",
+        "submit": "Nastavi geslo",
+        "setPasswordFailed": "Nastavitev gesla ni uspela",
+        "hasPassword": "Že imate geslo?",
+        "loginLink": "Prijava"
+      }
+    }
+  },
+  "layout": {
+    "header": {
+      "logo": "Tiny",
+      "openMenu": "Odpri meni",
+      "closeMenu": "Zapri meni",
+      "nav": {
+        "home": "Klepet"
+      },
+      "profile": "Profil",
+      "logout": "Odjava"
+    }
+  },
+  "profile": {
+    "head": {
+      "title": "Profil",
+      "description": "Vaš profil"
+    },
+    "form": {
+      "title": "Profil",
+      "description": "Posodobite podatke profila",
+      "email": "E-pošta",
+      "emailPlaceholder": "Vnesite svoj e-poštni naslov",
+      "name": "Ime",
+      "namePlaceholder": "Vnesite svoje ime",
+      "submit": "Shrani",
+      "submitLoading": "Shranjevanje...",
+      "notifications": {
+        "success": "Profil posodobljen",
+        "error": "Posodobitev profila ni uspela"
+      }
+    }
+  },
+  "chat": {
+    "head": {
+      "title": "Klepet",
+      "description": "Skupni klepet"
+    },
+    "title": "Klepet",
+    "roomTitle": "Soba",
+    "empty": "Še ni sporočil. Pozdravite.",
+    "composer": {
+      "label": "Sporočilo",
+      "placeholder": "Napišite sporočilo",
+      "submit": "Pošlji",
+      "submitLoading": "Pošiljanje...",
+      "error": "Sporočila ni bilo mogoče poslati."
+    }
+  },
+  "invite": {
+    "title": "Povabi",
+    "description": "Pošljite e-pošto z vabilom v ta klepet. Prejemnik naj odpre App URL in se prijavi.",
+    "email": "E-pošta",
+    "emailPlaceholder": "ime@example.com",
+    "submit": "Pošlji vabilo",
+    "submitLoading": "Pošiljanje...",
+    "success": "Vabilo je poslano.",
+    "error": "Vabila ni bilo mogoče poslati."
+  }
+}

package/templates/auth-chat/apps/fe/src/clients/app-rest-client.ts

@@ -0,0 +1,15 @@
+import { RestClient } from "@povio/openapi-codegen-cli";
+
+import { AuthorizationHeaderInterceptor } from "@/clients/rest/interceptors/authorization-header.interceptor";
+import { RefreshTokenInterceptor } from "@/clients/rest/interceptors/refresh-token.interceptor";
+import { ResponseInterceptor } from "@/clients/rest/interceptors/response.interceptor";
+import { AppConfig } from "@/config/app.config";
+import { AppErrorHandler } from "@/clients/rest/app-error-handler";
+
+export const AppRestClient = new RestClient({
+  config: {
+    baseURL: AppConfig.api.url,
+  },
+  errorHandler: AppErrorHandler,
+  interceptors: [AuthorizationHeaderInterceptor, RefreshTokenInterceptor, ResponseInterceptor],
+});

package/templates/auth-chat/apps/fe/src/clients/auth-token-store.ts

@@ -0,0 +1,101 @@
+import { ACCESS_TOKEN_KEY, REFRESH_TOKEN_KEY } from "@/config/jwt.config";
+
+type TokenListener = () => void;
+
+const listeners = new Set<TokenListener>();
+let storageListenerCount = 0;
+
+const isBrowser = () => typeof window !== "undefined";
+
+const readToken = (key: string) => {
+  if (!isBrowser()) {
+    return null;
+  }
+
+  try {
+    return window.localStorage.getItem(key);
+  } catch {
+    return null;
+  }
+};
+
+const writeToken = (key: string, token: string | null) => {
+  if (!isBrowser()) {
+    return;
+  }
+
+  try {
+    if (token) {
+      window.localStorage.setItem(key, token);
+    } else {
+      window.localStorage.removeItem(key);
+    }
+  } catch {
+    // Keep in-memory auth subscribers in sync even if storage is unavailable.
+  }
+};
+
+const emitChange = () => {
+  for (const listener of listeners) {
+    listener();
+  }
+};
+
+const onStorageChange = (event: StorageEvent) => {
+  if (event.storageArea !== window.localStorage) {
+    return;
+  }
+
+  if (event.key === ACCESS_TOKEN_KEY || event.key === REFRESH_TOKEN_KEY || event.key === null) {
+    emitChange();
+  }
+};
+
+export const authTokenStore = {
+  getAccessToken: () => readToken(ACCESS_TOKEN_KEY),
+  getRefreshToken: () => readToken(REFRESH_TOKEN_KEY),
+  getServerSnapshot: () => null,
+  subscribe: (listener: TokenListener) => {
+    listeners.add(listener);
+
+    if (isBrowser()) {
+      if (storageListenerCount === 0) {
+        window.addEventListener("storage", onStorageChange);
+      }
+      storageListenerCount += 1;
+    }
+
+    return () => {
+      listeners.delete(listener);
+
+      if (isBrowser()) {
+        storageListenerCount -= 1;
+        if (storageListenerCount === 0) {
+          window.removeEventListener("storage", onStorageChange);
+        }
+      }
+    };
+  },
+  setAccessToken: (token: string | null) => {
+    writeToken(ACCESS_TOKEN_KEY, token);
+    emitChange();
+  },
+  setRefreshToken: (token: string | null) => {
+    writeToken(REFRESH_TOKEN_KEY, token);
+    emitChange();
+  },
+  setTokens: (accessToken: string | null, refreshToken?: string | null) => {
+    writeToken(ACCESS_TOKEN_KEY, accessToken);
+
+    if (refreshToken !== undefined) {
+      writeToken(REFRESH_TOKEN_KEY, refreshToken);
+    }
+
+    emitChange();
+  },
+  clear: () => {
+    writeToken(ACCESS_TOKEN_KEY, null);
+    writeToken(REFRESH_TOKEN_KEY, null);
+    emitChange();
+  },
+};

package/templates/auth-chat/apps/fe/src/clients/rest/app-error-handler.ts

@@ -0,0 +1,31 @@
+import { type ErrorEntry, ErrorHandler } from "@povio/openapi-codegen-cli";
+
+export enum AuthErrorCodes {
+  InvalidCredentials = "invalid-credentials",
+  LocalAuthnIdentityExists = "identity-already-exists",
+  IdentityNotFound = "identity-not-found",
+  NotConfirmed = "identity-not-confirmed",
+}
+
+const authErrors: ErrorEntry<AuthErrorCodes>[] = [
+  {
+    code: AuthErrorCodes.InvalidCredentials,
+    getMessage: (t) => t("auth.shared.errors.invalidCredentials"),
+  },
+  {
+    code: AuthErrorCodes.LocalAuthnIdentityExists,
+    getMessage: (t) => t("auth.shared.errors.userAlreadyExists"),
+  },
+  {
+    code: AuthErrorCodes.IdentityNotFound,
+    getMessage: (t) => t("auth.shared.errors.identityNotFound"),
+  },
+  {
+    code: AuthErrorCodes.NotConfirmed,
+    getMessage: (t) => t("auth.shared.errors.notConfirmed"),
+  },
+];
+
+const entries = [...authErrors];
+
+export const AppErrorHandler = new ErrorHandler({ entries });

package/templates/auth-chat/apps/fe/src/clients/rest/interceptors/authorization-header.interceptor.ts

@@ -0,0 +1,15 @@
+import { RestInterceptor } from "@povio/openapi-codegen-cli";
+
+import { authTokenStore } from "@/clients/auth-token-store";
+
+export const AuthorizationHeaderInterceptor = new RestInterceptor((client) => {
+  return client.interceptors.request.use(async (config) => {
+    const accessToken = authTokenStore.getAccessToken();
+    if (accessToken != null) {
+      // oxlint-disable-next-line no-param-reassign
+      config.headers.Authorization = `Bearer ${accessToken}`;
+    }
+
+    return config;
+  });
+});

package/templates/auth-chat/apps/fe/src/clients/rest/interceptors/refresh-token.interceptor.ts

@@ -0,0 +1,37 @@
+import { RestInterceptor } from "@povio/openapi-codegen-cli";
+
+import { AuthErrorCodes } from "@/clients/rest/app-error-handler";
+import { UserAuthApi } from "@/openapi/userAuth/userAuth.api";
+import { authTokenStore } from "@/clients/auth-token-store";
+
+export const RefreshTokenInterceptor = new RestInterceptor((client) => {
+  return client.interceptors.response.use(
+    (response) => response,
+    // oxlint-disable-next-line promise/prefer-await-to-callbacks
+    async (error) => {
+      const originalRequest = error.config;
+
+      if (error.response?.data?.code === AuthErrorCodes.InvalidCredentials) {
+        return Promise.reject(error);
+      }
+
+      if (error.response?.status === 401 && !originalRequest._retry) {
+        originalRequest._retry = true;
+        try {
+          const refreshToken = authTokenStore.getRefreshToken();
+          const { accessToken, refreshToken: newRefreshToken } = await UserAuthApi.accessToken({
+            refreshToken: refreshToken || "",
+          });
+          authTokenStore.setTokens(accessToken, newRefreshToken || null);
+
+          originalRequest.headers.Authorization = `Bearer ${accessToken}`;
+
+          return client(originalRequest);
+        } catch {
+          authTokenStore.clear();
+        }
+      }
+      return Promise.reject(error);
+    },
+  );
+});

package/templates/auth-chat/apps/fe/src/clients/rest/interceptors/response.interceptor.ts

@@ -0,0 +1,17 @@
+import { RestInterceptor } from "@povio/openapi-codegen-cli";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export const ResponseInterceptor = new RestInterceptor((client) => {
+  return client.interceptors.response.use(
+    async (response: AxiosResponse) => {
+      return {
+        ...response,
+        data: response.data === "" ? undefined : response.data,
+      };
+    },
+    // oxlint-disable-next-line promise/prefer-await-to-callbacks
+    async (error: AxiosError) => {
+      throw error;
+    },
+  );
+});

package/templates/auth-chat/apps/fe/src/components/404.tsx

@@ -0,0 +1,18 @@
+import { useTranslation } from "react-i18next";
+
+import { NotFound } from "@/components/shared/error/NotFound";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+export const NotFoundPage = () => {
+  const { t } = useTranslation();
+
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.shared.notFound.head.title)}
+        description={t(($) => $.shared.notFound.head.description)}
+      />
+      <NotFound />
+    </>
+  );
+};

package/templates/auth-chat/apps/fe/src/components/features/auth/AuthBrandPanel.tsx

@@ -0,0 +1,60 @@
+import { Typography } from "@povio/ui";
+import { useTranslation } from "react-i18next";
+
+import { BrandLogo } from "@/components/shared/branding/BrandLogo";
+
+export function AuthBrandPanel() {
+  const { t } = useTranslation();
+
+  return (
+    <section className="relative hidden flex-1 overflow-hidden bg-elevation-fill-default-2 lg:flex lg:flex-col lg:justify-between">
+      <div className="relative z-raised flex flex-col gap-1 px-16 pt-20 xl:px-24 xl:pt-24">
+        <Typography
+          as="p"
+          className="text-text-default-2"
+          size="title-3"
+        >
+          {t(($) => $.auth.wrapper.title)}
+        </Typography>
+        <Typography
+          as="h1"
+          className="text-text-default-2"
+          size="title-1"
+          variant="prominent-1"
+        >
+          {t(($) => $.auth.wrapper.description)}
+        </Typography>
+      </div>
+
+      <BrandLogo className="absolute -right-12 top-10 text-[10rem] leading-none text-[#e1e9ee]" />
+
+      <svg
+        aria-hidden="true"
+        className="absolute bottom-0 left-0 h-auto w-full opacity-20"
+        viewBox="0 0 760 390"
+      >
+        <path
+          d="M0 245 80 202l62 22 98-85 92 77 68-45 76 53 84-113 74 95 126-50v234H0Z"
+          fill="#006ab6"
+        />
+        <path
+          d="m52 390 132-120 78 61 106-130 91 108 69-59 128 140Z"
+          fill="#006ab6"
+          opacity=".4"
+        />
+      </svg>
+
+      <div className="relative z-raised flex flex-col items-center gap-3 pb-8">
+        <BrandLogo className="text-interactive-contained-primary-idle" />
+        <Typography
+          as="span"
+          className="text-text-default-2"
+          size="body-4"
+          variant="prominent-1"
+        >
+          {t(($) => $.auth.wrapper.watermark, { year: new Date().getFullYear() })}
+        </Typography>
+      </div>
+    </section>
+  );
+}

package/templates/auth-chat/apps/fe/src/components/features/auth/AuthLayout.tsx

@@ -0,0 +1,23 @@
+import type { PropsWithChildren } from "react";
+
+import { BrandLogo } from "@/components/shared/branding/BrandLogo";
+
+import { AuthBrandPanel } from "./AuthBrandPanel";
+
+export function AuthLayout({ children }: PropsWithChildren) {
+  return (
+    <div className="flex min-h-dvh w-full overflow-hidden bg-elevation-fill-default-2">
+      <AuthBrandPanel />
+
+      <section className="m-4 flex w-full flex-1 flex-col rounded-sm bg-elevation-fill-default-1 lg:m-0 lg:rounded-none">
+        <div className="flex flex-1 items-center justify-center px-4 py-10 sm:px-8">
+          <div className="w-full max-w-[440px]">{children}</div>
+        </div>
+
+        <div className="flex justify-center pb-6 lg:hidden">
+          <BrandLogo className="text-interactive-contained-primary-idle" />
+        </div>
+      </section>
+    </div>
+  );
+}

package/templates/auth-chat/apps/fe/src/components/features/auth/LoginPage.tsx

@@ -0,0 +1,111 @@
+import { Alert, Button, PasswordInput, TextButton, TextInput, Typography, useForm } from "@povio/ui/tanstack";
+import { useNavigate } from "@tanstack/react-router";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+
+import { useAuth } from "@/hooks/useAuth";
+import { UserAuthModels } from "@/openapi/userAuth/userAuth.models";
+import { UserAuthQueries } from "@/openapi/userAuth/userAuth.queries";
+
+export function LoginPage() {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const { updateTokens, userPromise } = useAuth();
+
+  const [error, setError] = useState<string | null>(null);
+
+  const loginMutation = UserAuthQueries.useUserAuthLocalPasswordLogin();
+
+  const form = useForm({
+    zodSchema: UserAuthModels.UserAuthPasswordLoginRequestSchema,
+    defaultValues: {
+      email: "",
+      password: "",
+    },
+  });
+
+  const completeLogin = async (tokens: UserAuthModels.AuthnTokenResponse) => {
+    updateTokens?.(tokens.accessToken, tokens.refreshToken);
+    const user = await userPromise?.();
+    if (user === null) {
+      throw new Error(t(($) => $.auth.login.form.loginFailed));
+    }
+    await navigate({ to: "/" });
+  };
+
+  const onSubmit = async (data: UserAuthModels.UserAuthPasswordLoginRequest) => {
+    setError(null);
+    try {
+      const tokens = await loginMutation.mutateAsync({ data });
+      await completeLogin(tokens);
+    } catch (error) {
+      setError(error instanceof Error ? error.message : t(($) => $.auth.login.form.loginFailed));
+    }
+  };
+
+  return (
+    <div className="flex flex-col gap-8">
+      <div className="flex flex-col gap-3">
+        <Typography
+          variant="prominent-1"
+          size="title-2"
+          as="h2"
+          className="text-text-default-1"
+        >
+          {t(($) => $.auth.login.form.title)}
+        </Typography>
+      </div>
+
+      {error && (
+        <Alert
+          color="error"
+          text={error}
+        />
+      )}
+
+      <form
+        onSubmit={form.handleSubmit(onSubmit)}
+        className="flex flex-col gap-8"
+      >
+        <div className="flex flex-col gap-4">
+          <TextInput
+            field={{ form, name: "email" }}
+            label={t(($) => $.auth.login.form.email)}
+            placeholder={t(($) => $.auth.login.form.emailPlaceholder)}
+            size="default"
+          />
+
+          <PasswordInput
+            field={{ form, name: "password" }}
+            label={t(($) => $.auth.login.form.password)}
+            placeholder={t(($) => $.auth.login.form.passwordPlaceholder)}
+            size="default"
+          />
+        </div>
+
+        <div className="flex flex-col gap-4">
+          <Button
+            width="fill"
+            type="submit"
+            isDisabled={loginMutation.isPending}
+            isLoading={loginMutation.isPending}
+          >
+            {t(($) => $.auth.login.form.submit)}
+          </Button>
+
+        </div>
+      </form>
+
+      <div className="flex justify-center gap-1 border-elevation-outline-default-1 border-t pt-6">
+        <Typography
+          size="label-2"
+          className="text-text-default-2"
+        >
+          {t(($) => $.auth.login.form.noAccount)}
+        </Typography>
+
+        <TextButton link={{ to: "/register" }}>{t(($) => $.auth.login.form.registerLink)}</TextButton>
+      </div>
+    </div>
+  );
+}