feat: Add tsconfig shortcut paths for components etc for web

apps/web/src/app/[locale]/(infoscreen)/infoscreen/layout.tsx

@@ -1,9 +1,9 @@
 import React from "react";
 // eslint-disable-next-line camelcase -- Roboto_Mono name is set by next/font
 import { Inter, Roboto_Mono } from "next/font/google";
-import { cn } from "../../../../lib/utils.ts";
+import { cn } from "@lib/utils.ts";
 import "../../globals.css";
-import { InfoScreenHeader } from "../../../../components/infoscreen/infoscreen-header/index.tsx";
+import { InfoScreenHeader } from "@components/infoscreen/infoscreen-header/index.tsx";
 
 const inter = Inter({
   subsets: ["latin"],

apps/web/src/app/[locale]/(infoscreen)/infoscreen/page.tsx

@@ -1,7 +1,7 @@
-import { HSLcombinedSchedule } from "../../../../components/infoscreen/hsl-schedules";
-import { KanttiinitCombined } from "../../../../components/infoscreen/kanttiinit";
-import InfoScreenSwitcher from "../../../../components/infoscreen/infoscreen-switcher/index";
-import EventListInfoscreen from "../../../../components/infoscreen/events-list";
+import { HSLcombinedSchedule } from "@components/infoscreen/hsl-schedules";
+import { KanttiinitCombined } from "@components/infoscreen/kanttiinit";
+import InfoScreenSwitcher from "@components/infoscreen/infoscreen-switcher/index";
+import EventListInfoscreen from "@components/infoscreen/events-list";
 
 export const dynamic = "force-dynamic";
 

apps/web/src/app/[locale]/(main)/[...path]/page.tsx

@@ -3,16 +3,16 @@ import type { Metadata } from "next";
 import { notFound, redirect } from "next/navigation";
 import type { Page as CMSPage } from "@tietokilta/cms-types/payload";
 import { Card } from "@tietokilta/ui";
-import { AdminBar } from "../../../../components/admin-bar";
-import { LexicalSerializer } from "../../../../components/lexical/lexical-serializer";
-import { TableOfContents } from "../../../../components/table-of-contents";
-import { fetchPage } from "../../../../lib/api/pages";
-import { getCurrentLocale, type Locale } from "../../../../locales/server";
-import EventsPage from "../../../../custom-pages/events-page";
-import AllEventsPage from "../../../../custom-pages/all-events-page";
-import WeeklyNewsletterPage from "../../../../custom-pages/weekly-newsletter-page";
-import { generateTocFromRichText } from "../../../../lib/utils";
-import WeeklyNewslettersListPage from "../../../../custom-pages/weekly-newsletters-list-page";
+import WeeklyNewslettersListPage from "@custom-pages/weekly-newsletters-list-page";
+import EventsPage from "@custom-pages/events-page";
+import AllEventsPage from "@custom-pages/all-events-page";
+import WeeklyNewsletterPage from "@custom-pages/weekly-newsletter-page";
+import { AdminBar } from "@components/admin-bar";
+import { LexicalSerializer } from "@components/lexical/lexical-serializer";
+import { TableOfContents } from "@components/table-of-contents";
+import { fetchPage } from "@lib/api/pages";
+import { getCurrentLocale, type Locale } from "@locales/server";
+import { generateTocFromRichText } from "@lib/utils";
 import { openGraphImage } from "../../../shared-metadata";
 
 interface NextPage<Params extends Record<string, unknown>> {

apps/web/src/app/[locale]/(main)/error.tsx

@@ -5,7 +5,7 @@ import {
   I18nProviderClient,
   useCurrentLocale,
   useScopedI18n,
-} from "../../../locales/client";
+} from "@locales/client";
 
 function Error({
   error,

apps/web/src/app/[locale]/(main)/events/[slug]/page.tsx

@@ -14,8 +14,8 @@ import {
   type EventQuestion,
   type QuotaSignup,
   type QuestionAnswer,
-} from "../../../../../lib/api/external/ilmomasiina";
-import { signUp } from "../../../../../lib/api/external/ilmomasiina/actions";
+} from "@lib/api/external/ilmomasiina";
+import { signUp } from "@lib/api/external/ilmomasiina/actions";
 import {
   cn,
   formatDateTimeSeconds,
@@ -24,12 +24,12 @@ import {
   formatDatetimeYearOptions,
   getLocalizedEventTitle,
   getQuotasWithOpenAndQueue,
-} from "../../../../../lib/utils";
-import { BackButton } from "../../../../../components/back-button";
-import { getCurrentLocale, getScopedI18n } from "../../../../../locales/server";
-import { DateTime } from "../../../../../components/datetime";
+} from "@lib/utils";
+import { BackButton } from "@components/back-button";
+import { getCurrentLocale, getScopedI18n } from "@locales/server";
+import { DateTime } from "@components/datetime";
+import { remarkI18n } from "@lib/plugins/remark-i18n";
 import { openGraphImage } from "../../../../shared-metadata";
-import { remarkI18n } from "../../../../../lib/plugins/remark-i18n";
 import { SignUpButton } from "./signup-button";
 
 async function SignUpText({

apps/web/src/app/[locale]/(main)/events/[slug]/signup-button.tsx

@@ -3,7 +3,7 @@
 import Form from "next/form";
 import { Button, type ButtonProps } from "@tietokilta/ui";
 import { useFormStatus } from "react-dom";
-import type { signUp } from "../../../../../lib/api/external/ilmomasiina/actions";
+import type { signUp } from "@lib/api/external/ilmomasiina/actions";
 
 function StatusButton({ disabled, ...props }: ButtonProps) {
   const { pending } = useFormStatus();
@@ -22,7 +22,7 @@
   signUpAction: typeof signUp;
 }>) {
   return (
     <Form action={signUpAction} className="contents">
       <input type="hidden" name="quotaId" value={quotaId} />
       <StatusButton type="submit" disabled={isDisabled} variant="secondary">
         {children}

apps/web/src/app/[locale]/(main)/global-error.tsx

@@ -5,7 +5,7 @@ import {
   I18nProviderClient,
   useCurrentLocale,
   useScopedI18n,
-} from "../../../locales/client";
+} from "@locales/client";
 
 function GlobalError({
   error,

apps/web/src/app/[locale]/(main)/layout.tsx

@@ -2,15 +2,15 @@ import type { Metadata, Viewport } from "next";
 // eslint-disable-next-line camelcase -- next/font/google
 import { Inter, Roboto_Mono } from "next/font/google";
 import NextTopLoader from "nextjs-toploader";
-import { Footer } from "../../../components/footer";
-import { MainNav } from "../../../components/main-nav";
-import { MobileNav } from "../../../components/mobile-nav";
-import { SkipLink } from "../../../components/skip-link";
-import { cn } from "../../../lib/utils";
+import { Footer } from "@components/footer";
+import { MainNav } from "@components/main-nav";
+import { MobileNav } from "@components/mobile-nav";
+import { SkipLink } from "@components/skip-link";
+import { cn } from "@lib/utils";
 import "@tietokilta/ui/global.css";
 import "../globals.css";
-import { type Locale } from "../../../locales/server";
-import { DigiCommitteeRecruitmentAlert } from "../../../components/digi-committee-recruitment-alert";
+import { type Locale } from "@locales/server";
+import { DigiCommitteeRecruitmentAlert } from "@components/digi-committee-recruitment-alert";
 
 const inter = Inter({ subsets: ["latin"], variable: "--font-inter" });
 const robotoMono = Roboto_Mono({

apps/web/src/app/[locale]/(main)/not-found.tsx

@@ -1,12 +1,12 @@
 "use client";
 import { Button, Card } from "@tietokilta/ui";
 import Link from "next/link";
-import { DinoGame } from "../../../components/dino-game";
+import { DinoGame } from "@components/dino-game";
 import {
   I18nProviderClient,
   useCurrentLocale,
   useScopedI18n,
-} from "../../../locales/client";
+} from "@locales/client";
 
 function Page() {
   const t = useScopedI18n("not-found");

apps/web/src/app/[locale]/(main)/page.tsx

@@ -1,12 +1,12 @@
 import type { EditorState } from "@tietokilta/cms-types/lexical";
 import type { News, Page as CMSPage } from "@tietokilta/cms-types/payload";
 import { type Metadata } from "next";
-import { EventsDisplay } from "../../../components/events-display";
-import { Hero, type ImageWithPhotographer } from "../../../components/hero";
-import { LexicalSerializer } from "../../../components/lexical/lexical-serializer";
-import { fetchLandingPage } from "../../../lib/api/landing-page";
-import { AnnouncementCard } from "../../../components/announcement-card";
-import { getCurrentLocale } from "../../../locales/server";
+import { EventsDisplay } from "@components/events-display";
+import { Hero, type ImageWithPhotographer } from "@components/hero";
+import { LexicalSerializer } from "@components/lexical/lexical-serializer";
+import { fetchLandingPage } from "@lib/api/landing-page";
+import { AnnouncementCard } from "@components/announcement-card";
+import { getCurrentLocale } from "@locales/server";
 import { openGraphImage } from "../../shared-metadata";
 
 function Content({ content }: { content?: EditorState }) {

apps/web/src/app/[locale]/(main)/signups/[signupId]/[signupEditToken]/page.tsx

@@ -1,16 +1,13 @@
 /* eslint-disable no-nested-ternary -- I like */
 import { notFound } from "next/navigation";
-import { getSignup } from "../../../../../../lib/api/external/ilmomasiina";
-import { openGraphImage } from "../../../../../shared-metadata";
+import { getSignup } from "@lib/api/external/ilmomasiina";
 import {
   deleteSignUpAction,
   saveSignUpAction,
-} from "../../../../../../lib/api/external/ilmomasiina/actions";
-import {
-  getCurrentLocale,
-  getScopedI18n,
-} from "../../../../../../locales/server";
-import { getLocalizedEventTitle } from "../../../../../../lib/utils";
+} from "@lib/api/external/ilmomasiina/actions";
+import { getCurrentLocale, getScopedI18n } from "@locales/server";
+import { getLocalizedEventTitle } from "@lib/utils";
+import { openGraphImage } from "../../../../../shared-metadata";
 import { SignupForm } from "./signup-form";
 
 interface PageProps {

apps/web/src/app/[locale]/(main)/signups/[signupId]/[signupEditToken]/signup-form.tsx

@@ -20,17 +20,17 @@
   ilmomasiinaFieldErrors,
   type IlmomasiinaEvent,
   type IlmomasiinaSignupInfo,
-} from "../../../../../../lib/api/external/ilmomasiina";
+} from "@lib/api/external/ilmomasiina";
 import type {
   deleteSignUpAction,
   saveSignUpAction,
-} from "../../../../../../lib/api/external/ilmomasiina/actions";
+} from "@lib/api/external/ilmomasiina/actions";
 import {
   I18nProviderClient,
   useCurrentLocale,
   useScopedI18n,
-} from "../../../../../../locales/client";
-import { cn, getLocalizedEventTitle } from "../../../../../../lib/utils";
+} from "@locales/client";
+import { cn, getLocalizedEventTitle } from "@lib/utils";
 
 type FieldErrorI18n = ReturnType<typeof useScopedI18n>;
 
@@ -176,8 +176,8 @@
       </p>
       <input
         type="button"
         popoverTarget={id}
         popoverTargetAction="hide"
         className={cn(
           buttonVariants({ variant: "outline" }),
           "w-full max-w-sm cursor-pointer",
@@ -187,7 +187,7 @@
       <StatusButton
         type="submit"
         formNoValidate
         formAction={deleteAction}
         variant="destructive"
         className="w-full max-w-sm"
       >
@@ -377,7 +377,7 @@
         <input
           type="button"
           disabled={isSignupPeriodEnded}
           popoverTarget="confirm-delete"
           className={cn(
             buttonVariants({ variant: "outline" }),
             "w-full max-w-sm cursor-pointer",

apps/web/src/app/[locale]/(main)/signups/not-found.tsx

@@ -1,12 +1,12 @@
 "use client";
 import { Button, Card } from "@tietokilta/ui";
 import Link from "next/link";
-import { DinoGame } from "../../../../components/dino-game";
+import { DinoGame } from "@components/dino-game";
 import {
   I18nProviderClient,
   useCurrentLocale,
   useScopedI18n,
-} from "../../../../locales/client";
+} from "@locales/client";
 
 function Page() {
   const t = useScopedI18n("not-found");

apps/web/src/app/[locale]/(main)/tapahtumat/not-found.tsx

@@ -1,12 +1,12 @@
 "use client";
 import { Button, Card } from "@tietokilta/ui";
 import Link from "next/link";
-import { DinoGame } from "../../../../components/dino-game";
+import { DinoGame } from "@components/dino-game";
 import {
   I18nProviderClient,
   useCurrentLocale,
   useScopedI18n,
-} from "../../../../locales/client";
+} from "@locales/client";
 
 function Page() {
   const t = useScopedI18n("not-found");

apps/web/src/app/[locale]/(main)/weekly-newsletters/[slug]/page.tsx

@@ -1,4 +1,4 @@
-import WeeklyNewsletterPage from "../../../../../custom-pages/weekly-newsletter-page";
+import WeeklyNewsletterPage from "@custom-pages/weekly-newsletter-page";
 
 interface PageProps {
   params: Promise<{

apps/web/tsconfig.json

@@ -7,7 +7,13 @@
       {
         "name": "next"
       }
-    ]
+    ],
+    "paths": {
+      "@components/*": ["./src/components/*"],
+      "@lib/*": ["./src/lib/*"],
+      "@locales/*": ["./src/locales/*"],
+      "@custom-pages/*": ["./src/custom-pages/*"]
+    }
   },
   "include": ["src", "next-env.d.ts", ".next/types/**/*.ts"]
 }