robodev 0.23.0 → 0.25.0

package/templates/marketplace/apps/fe/src/main.tsx

@@ -0,0 +1,52 @@
+import { AbilityContext } from "@povio/openapi-codegen-cli/acl";
+import { LinkContext, type LinkNavigationProps } from "@povio/ui";
+import { QueryClientProvider } from "@tanstack/react-query";
+import { RouterProvider, createLink, createRouter } from "@tanstack/react-router";
+import { type ComponentType, StrictMode } from "react";
+import { Link as AriaLink } from "react-aria-components";
+import { createRoot } from "react-dom/client";
+
+import { queryClient } from "@/config/query.config";
+import Providers from "@/providers";
+import { JWTProvider } from "@/providers/jwt.provider";
+import "@/styles/globals.css";
+
+import { routeTree } from "./routeTree.gen";
+
+const LinkComponent = createLink(AriaLink) as unknown as ComponentType<LinkNavigationProps>;
+
+const router = createRouter({
+  routeTree,
+  defaultPreload: "intent",
+  scrollRestoration: true,
+  defaultStructuralSharing: true,
+  defaultPreloadStaleTime: 0,
+  // basepath: import.meta.env.BASE_URL, // Uncomment in monorepo
+});
+
+declare module "@tanstack/react-router" {
+  interface Register {
+    router: typeof router;
+  }
+}
+
+const rootElement = document.getElementById("app");
+
+if (rootElement && !rootElement.innerHTML) {
+  const root = createRoot(rootElement);
+
+  root.render(
+    <StrictMode>
+      <Providers
+        providers={[
+          { provider: LinkContext.LinkContextProvider, props: { LinkComponent } },
+          { provider: QueryClientProvider, props: { client: queryClient } },
+          { provider: JWTProvider },
+          { provider: AbilityContext.Provider },
+        ]}
+      >
+        <RouterProvider router={router} />
+      </Providers>
+    </StrictMode>,
+  );
+}

package/templates/marketplace/apps/fe/src/pages/(guest)/login.tsx

@@ -0,0 +1,23 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { LoginPage } from "@/components/features/auth/LoginPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+function PageComponent() {
+  const { t } = useTranslation();
+
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.auth.login.head.title)}
+        description={t(($) => $.auth.login.head.description)}
+      />
+      <LoginPage />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(guest)/login")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(guest)/register.tsx

@@ -0,0 +1,23 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { RegisterPage } from "@/components/features/auth/RegisterPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+function PageComponent() {
+  const { t } = useTranslation();
+
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.auth.register.head.title)}
+        description={t(($) => $.auth.register.head.description)}
+      />
+      <RegisterPage />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(guest)/register")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(guest)/route.tsx

@@ -0,0 +1,18 @@
+import { AuthGuard } from "@povio/openapi-codegen-cli";
+import { Outlet, createFileRoute } from "@tanstack/react-router";
+
+import { AuthLayout } from "@/components/features/auth/AuthLayout";
+
+function GuestLayout() {
+  return (
+    <AuthGuard type="public-only">
+      <AuthLayout>
+        <Outlet />
+      </AuthLayout>
+    </AuthGuard>
+  );
+}
+
+export const Route = createFileRoute("/(guest)")({
+  component: GuestLayout,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/cart.tsx

@@ -0,0 +1,22 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { CartPage } from "@/components/features/marketplace/CartPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+function PageComponent() {
+  const { t } = useTranslation();
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.cart.head.title)}
+        description={t(($) => $.cart.head.description)}
+      />
+      <CartPage />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/cart")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/checkout.tsx

@@ -0,0 +1,22 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { CheckoutPage } from "@/components/features/marketplace/CheckoutPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+function PageComponent() {
+  const { t } = useTranslation();
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.checkout.head.title)}
+        description={t(($) => $.checkout.head.description)}
+      />
+      <CheckoutPage />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/checkout")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/index.tsx

@@ -0,0 +1,22 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { BrowsePage } from "@/components/features/marketplace/BrowsePage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+function PageComponent() {
+  const { t } = useTranslation();
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.browse.head.title)}
+        description={t(($) => $.browse.head.description)}
+      />
+      <BrowsePage />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/listings/$id/index.tsx

@@ -0,0 +1,37 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { ListingDetailsPage } from "@/components/features/marketplace/ListingDetailsPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+import { LoadingState } from "@/components/shared/layout/LoadingState";
+import { ListingQueries } from "@/openapi/listing/listing.queries";
+
+function PageComponent() {
+  const { id } = Route.useParams();
+  const { t } = useTranslation();
+  const { data: listing, isLoading } = ListingQueries.useGetById({ id }, { enabled: !!id });
+
+  if (isLoading) return <LoadingState />;
+  if (!listing) {
+    return (
+      <>
+        <AppHead title={t(($) => $.browse.head.title)} />
+        <p className="text-text-default-2">{t(($) => $.listing.notFound)}</p>
+      </>
+    );
+  }
+
+  return (
+    <>
+      <AppHead
+        title={listing.title}
+        description={listing.description ?? undefined}
+      />
+      <ListingDetailsPage listing={listing} />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/listings/$id/")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/my-listings.tsx

@@ -0,0 +1,32 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+import { z } from "zod";
+
+import { MyListingsPage } from "@/components/features/marketplace/MyListingsPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+const myListingsSearchSchema = z.object({
+  create: z
+    .union([z.boolean(), z.string()])
+    .optional()
+    .transform((value) => value === true || value === "true"),
+});
+
+function PageComponent() {
+  const { t } = useTranslation();
+  const { create } = Route.useSearch();
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.sell.head.title)}
+        description={t(($) => $.sell.head.description)}
+      />
+      <MyListingsPage openCreate={create} />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/my-listings")({
+  component: PageComponent,
+  validateSearch: myListingsSearchSchema,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/orders/$id.tsx

@@ -0,0 +1,40 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { OrderDetailPage } from "@/components/features/marketplace/OrdersPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+import { LoadingState } from "@/components/shared/layout/LoadingState";
+import { useAuth } from "@/hooks/useAuth";
+import { OrderQueries } from "@/openapi/order/order.queries";
+
+function PageComponent() {
+  const { id } = Route.useParams();
+  const { t } = useTranslation();
+  const { user } = useAuth();
+  const { data: order, isLoading } = OrderQueries.useGetById({ id }, { enabled: !!id });
+
+  if (isLoading) return <LoadingState />;
+  if (!order) {
+    return (
+      <>
+        <AppHead title={t(($) => $.orders.head.title)} />
+        <p className="text-text-default-2">{t(($) => $.orders.notFound)}</p>
+      </>
+    );
+  }
+
+  const role = user?.id === order.sellerId ? "seller" : "buyer";
+  return (
+    <>
+      <AppHead title={t(($) => $.orders.head.title)} />
+      <OrderDetailPage
+        order={order}
+        role={role}
+      />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/orders/$id")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/orders/index.tsx

@@ -0,0 +1,22 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { OrdersPage } from "@/components/features/marketplace/OrdersPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+function PageComponent() {
+  const { t } = useTranslation();
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.orders.head.title)}
+        description={t(($) => $.orders.head.description)}
+      />
+      <OrdersPage />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/orders/")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/profile.tsx

@@ -0,0 +1,23 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { ProfilePage } from "@/components/features/profile/ProfilePage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+function PageComponent() {
+  const { t } = useTranslation();
+
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.profile.head.title)}
+        description={t(($) => $.profile.head.description)}
+      />
+      <ProfilePage />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/profile")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/route.tsx

@@ -0,0 +1,18 @@
+import { AuthGuard } from "@povio/openapi-codegen-cli";
+import { Outlet, createFileRoute } from "@tanstack/react-router";
+
+import { AppLayout } from "@/components/layout/AppLayout";
+
+function PrivateLayout() {
+  return (
+    <AuthGuard type="private">
+      <AppLayout>
+        <Outlet />
+      </AppLayout>
+    </AuthGuard>
+  );
+}
+
+export const Route = createFileRoute("/(private)")({
+  component: PrivateLayout,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/sales.tsx

@@ -0,0 +1,22 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { OrdersPage } from "@/components/features/marketplace/OrdersPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+function PageComponent() {
+  const { t } = useTranslation();
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.orders.sales)}
+        description={t(($) => $.orders.head.description)}
+      />
+      <OrdersPage />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/sales")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/sell/$id.tsx

@@ -0,0 +1,44 @@
+import { Navigate, createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { ListingFormPage } from "@/components/features/marketplace/ListingFormPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+import { LoadingState } from "@/components/shared/layout/LoadingState";
+import { useAuth } from "@/hooks/useAuth";
+import { ListingQueries } from "@/openapi/listing/listing.queries";
+
+function PageComponent() {
+  const { id } = Route.useParams();
+  const { t } = useTranslation();
+  const { user } = useAuth();
+  const { data: listing, isLoading } = ListingQueries.useGetById({ id }, { enabled: !!id });
+
+  if (isLoading) return <LoadingState />;
+  if (!listing) {
+    return (
+      <>
+        <AppHead title={t(($) => $.listingForm.editTitle)} />
+        <p className="text-text-default-2">{t(($) => $.listing.notFound)}</p>
+      </>
+    );
+  }
+  if (user?.id !== listing.sellerId) {
+    return (
+      <Navigate
+        to="/listings/$id"
+        params={{ id: listing.id }}
+      />
+    );
+  }
+
+  return (
+    <>
+      <AppHead title={t(($) => $.listingForm.editTitle)} />
+      <ListingFormPage listing={listing} />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/sell/$id")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/sell/index.tsx

@@ -0,0 +1,15 @@
+import { Navigate, createFileRoute } from "@tanstack/react-router";
+
+function PageComponent() {
+  return (
+    <Navigate
+      to="/my-listings"
+      search={{ create: true }}
+      replace
+    />
+  );
+}
+
+export const Route = createFileRoute("/(private)/sell/")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(private)/watchlist.tsx

@@ -0,0 +1,22 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useTranslation } from "react-i18next";
+
+import { WatchlistPage } from "@/components/features/marketplace/WatchlistPage";
+import { AppHead } from "@/components/shared/head/AppHead";
+
+function PageComponent() {
+  const { t } = useTranslation();
+  return (
+    <>
+      <AppHead
+        title={t(($) => $.watchlist.head.title)}
+        description={t(($) => $.watchlist.head.description)}
+      />
+      <WatchlistPage />
+    </>
+  );
+}
+
+export const Route = createFileRoute("/(private)/watchlist")({
+  component: PageComponent,
+});

package/templates/marketplace/apps/fe/src/pages/(public)/auth.tsx

@@ -0,0 +1,37 @@
+import { createFileRoute, useNavigate } from "@tanstack/react-router";
+import { useEffect } from "react";
+import z from "zod";
+
+import { LoadingState } from "@/components/shared/layout/LoadingState";
+import { useAuth } from "@/hooks/useAuth";
+
+const authSearchSchema = z.object({
+  type: z.string().optional(),
+  accessToken: z.string().optional(),
+  refreshToken: z.string().optional(),
+});
+
+function AuthCallbackPage() {
+  const navigate = useNavigate();
+  const { accessToken, refreshToken } = Route.useSearch();
+  const { updateTokens } = useAuth();
+
+  useEffect(() => {
+    if (accessToken) {
+      const decodedAccessToken = decodeURIComponent(accessToken);
+      const decodedRefreshToken = refreshToken ? decodeURIComponent(refreshToken) : undefined;
+      updateTokens?.(decodedAccessToken, decodedRefreshToken);
+
+      navigate({ to: "/" });
+    } else {
+      navigate({ to: "/login" });
+    }
+  }, [accessToken, refreshToken, navigate, updateTokens]);
+
+  return <LoadingState />;
+}
+
+export const Route = createFileRoute("/(public)/auth")({
+  component: AuthCallbackPage,
+  validateSearch: authSearchSchema,
+});

package/templates/marketplace/apps/fe/src/pages/(public)/route.tsx

@@ -0,0 +1,9 @@
+import { Outlet, createFileRoute } from "@tanstack/react-router";
+
+function PublicLayout() {
+  return <Outlet />;
+}
+
+export const Route = createFileRoute("/(public)")({
+  component: PublicLayout,
+});