chore: lint fix

.eslintrc.json

@@ -1,3 +1,56 @@
 {
-  "extends": "next/core-web-vitals"
+  "extends": ["next/core-web-vitals", "plugin:import/recommended"],
+  "plugins": ["simple-import-sort"],
+  "rules": {
+    "simple-import-sort/imports": [
+      "error",
+      {
+        "groups": [
+          // Side effect imports.
+          ["^\\u0000"],
+          // Node.js builtins.
+          ["^node:"],
+          // NPM packages.
+          ["^@?\\w"],
+          // Internal packages.
+          ["^@scandic-hotels/(?!.*\u0000$).*$"],
+          // Local imports (lib, constants, etc.), excl. types.
+          [
+            "^@/constants/?(?!.*\u0000$).*$",
+            "^@/env/?(?!.*\u0000$).*$",
+            "^@/lib/?(?!.*\u0000$).*$",
+            "^@/server/?(?!.*\u0000$).*$",
+            "^@/stores/?(?!.*\u0000$).*$"
+          ],
+          // Local imports (the rest), excl. types.
+          ["^@/(?!(types|.*\u0000$)).*$"],
+          // Parent imports. Put `..` last.
+          // Other relative imports. Put same-folder imports and `.` last.
+          [
+            "^\\.\\.(?!/?$)",
+            "^\\.\\./?$",
+            "^\\./(?=.*/)(?!/?$)",
+            "^\\.(?!/?$)",
+            "^\\./?$"
+          ],
+          // Style imports.
+          ["^(?!\\u0000).+\\.s?css$"],
+          // Node.js builtins and NPM packages type imports.
+          ["^node:.*\\u0000$", "^@?\\w.*\\u0000$"],
+          // Local type imports.
+          [
+            "^@scandichotels/.*\\u0000$",
+            "^@/types/.*",
+            "^@/.*\\u0000$",
+            "^[^.].*\\u0000$",
+            "^\\..*\\u0000$"
+          ]
+        ]
+      }
+    ],
+    "simple-import-sort/exports": "error",
+    "import/first": "error",
+    "import/newline-after-import": "error",
+    "import/no-duplicates": "error"
+  }
 }

app/[lang]/(live)/(protected)/logout/route.ts

@@ -1,9 +1,10 @@
 import { NextRequest, NextResponse } from "next/server"
 import { AuthError } from "next-auth"
 
-import { signOut } from "@/auth"
 import { badRequest } from "@/server/errors/next"
 
+import { signOut } from "@/auth"
+
 export async function GET(request: NextRequest) {
   const returnUrl = request.headers.get("x-returnurl")
 

app/[lang]/(live)/(protected)/my-pages/@breadcrumbs/benefits/page.tsx

@@ -1,5 +1,5 @@
-import { serverClient } from "@/lib/trpc/server"
 import { benefits } from "@/constants/routes/myPages"
+import { serverClient } from "@/lib/trpc/server"
 
 import Breadcrumbs from "@/components/MyPages/Breadcrumbs"
 

app/[lang]/(live)/(protected)/my-pages/@breadcrumbs/overview/page.tsx

@@ -1,5 +1,5 @@
-import { serverClient } from "@/lib/trpc/server"
 import { overview } from "@/constants/routes/myPages"
+import { serverClient } from "@/lib/trpc/server"
 
 import Breadcrumbs from "@/components/MyPages/Breadcrumbs"
 

app/[lang]/(live)/(protected)/my-pages/@breadcrumbs/profile/[...catchAll]/page.tsx

@@ -1,5 +1,5 @@
-import { serverClient } from "@/lib/trpc/server"
 import { profile } from "@/constants/routes/myPages"
+import { serverClient } from "@/lib/trpc/server"
 
 import Breadcrumbs from "@/components/MyPages/Breadcrumbs"
 

app/[lang]/(live)/(protected)/my-pages/@breadcrumbs/profile/page.tsx

@@ -1,5 +1,5 @@
-import { serverClient } from "@/lib/trpc/server"
 import { profile } from "@/constants/routes/myPages"
+import { serverClient } from "@/lib/trpc/server"
 
 import Breadcrumbs from "@/components/MyPages/Breadcrumbs"
 

app/[lang]/(live)/(protected)/my-pages/@breadcrumbs/stays/page.tsx

@@ -1,5 +1,5 @@
-import { serverClient } from "@/lib/trpc/server"
 import { stays } from "@/constants/routes/myPages"
+import { serverClient } from "@/lib/trpc/server"
 
 import Breadcrumbs from "@/components/MyPages/Breadcrumbs"
 

app/[lang]/(live)/(protected)/my-pages/benefits/page.tsx

@@ -1,13 +1,14 @@
-import Title from "@/components/MyPages/Title"
 import CurrentBenefitsBlock from "@/components/MyPages/Blocks/Benefits/CurrentLevel"
 import NextLevelBenefitsBlock from "@/components/MyPages/Blocks/Benefits/NextLevel"
 import Shortcuts from "@/components/MyPages/Blocks/Shortcuts"
+import Title from "@/components/MyPages/Title"
 
 import { shortcuts } from "./_constants"
 
-import type { LangParams, PageArgs } from "@/types/params"
 import styles from "./page.module.css"
 
+import type { LangParams, PageArgs } from "@/types/params"
+
 export default function BenefitsPage({ params }: PageArgs<LangParams>) {
   return (
     <main className={styles.container}>

app/[lang]/(live)/(protected)/my-pages/layout.tsx

@@ -1,5 +1,4 @@
 import { firaMono, firaSans } from "@/app/[lang]/(live)/fonts"
-
 import Header from "@/components/MyPages/Header"
 import Sidebar from "@/components/MyPages/Sidebar"
 

app/[lang]/(live)/(protected)/my-pages/overview/page.tsx

@@ -3,8 +3,8 @@ import { serverClient } from "@/lib/trpc/server"
 
 import MaxWidth from "@/components/MaxWidth"
 import Overview from "@/components/MyPages/Blocks/Overview"
-import Shortcuts from "@/components/MyPages/Blocks/Shortcuts"
 import UpcomingStays from "@/components/MyPages/Blocks/Overview/UpcomingStays"
+import Shortcuts from "@/components/MyPages/Blocks/Shortcuts"
 
 import styles from "./page.module.css"
 

app/[lang]/(live)/(protected)/my-pages/profile/@edit/edit/page.tsx

@@ -1,6 +1,6 @@
 "use client"
-import { _ } from "@/lib/translation"
 import { profile } from "@/constants/routes/myPages"
+import { _ } from "@/lib/translation"
 import { useProfileStore } from "@/stores/edit-profile"
 
 import Button from "@/components/TempDesignSystem/Button"

app/[lang]/(live)/(protected)/my-pages/profile/@view/page.tsx

@@ -1,5 +1,5 @@
-import { _ } from "@/lib/translation"
 import { profileEdit } from "@/constants/routes/myPages"
+import { _ } from "@/lib/translation"
 
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"

app/[lang]/(live)/(protected)/my-pages/profile/edit/page.tsx

@@ -1,4 +1,5 @@
 import "../profileLayout.css"
+
 export default function EditProfilePage() {
   return null
 }

app/[lang]/(live)/(protected)/my-pages/stays/page.tsx

@@ -1,5 +1,5 @@
-import UpcomingStays from "@/components/MyPages/Blocks/Stays/Upcoming"
 import PreviousStays from "@/components/MyPages/Blocks/Stays/Previous"
+import UpcomingStays from "@/components/MyPages/Blocks/Stays/Upcoming"
 
 import styles from "./page.module.css"
 

app/[lang]/(live)/(public)/login/route.ts

@@ -1,11 +1,12 @@
 import { NextRequest, NextResponse } from "next/server"
 import { AuthError } from "next-auth"
 
-import { signIn } from "@/auth"
 import { Lang } from "@/constants/languages"
 import { env } from "@/env/server"
 import { badRequest, internalServerError } from "@/server/errors/next"
 
+import { signIn } from "@/auth"
+
 export async function GET(
   request: NextRequest,
   context: { params: { lang: Lang } }

app/[lang]/(live)/layout.tsx

@@ -1,17 +1,18 @@
+import "@/app/globals.css"
+import "@scandic-hotels/design-system/style.css"
+
+import Script from "next/script"
 import { SessionProvider } from "next-auth/react"
 
-import { auth } from "@/auth"
-
-import AdobeScript from "@/components/Current/AdobeScript"
-import Script from "next/script"
 import TrpcProvider from "@/lib/trpc/Provider"
+
+import { auth } from "@/auth"
+import AdobeScript from "@/components/Current/AdobeScript"
 import VwoScript from "@/components/Current/VwoScript"
 
 import type { Metadata } from "next"
-import type { LangParams, LayoutArgs } from "@/types/params"
 
-import "@/app/globals.css"
+import type { LangParams, LayoutArgs } from "@/types/params"
-import "@scandic-hotels/design-system/style.css"
 
 export const metadata: Metadata = {
   description: "New web",

app/[lang]/(live-current)/current-content-page/page.tsx

@@ -1,14 +1,14 @@
 import { notFound } from "next/navigation"
 
-import { request } from "@/lib/graphql/request"
 import { GetCurrentBlockPage } from "@/lib/graphql/Query/CurrentBlockPage.graphql"
 import { GetCurrentBlockPageTrackingData } from "@/lib/graphql/Query/CurrentBlockPageTrackingData.graphql"
+import { request } from "@/lib/graphql/request"
 
 import ContentPage from "@/components/Current/ContentPage"
 import Header from "@/components/Current/Header"
 import Tracking from "@/components/Current/Tracking"
 
-import type { PageArgs, LangParams, UriParams } from "@/types/params"
+import type { LangParams, PageArgs, UriParams } from "@/types/params"
 import type { GetCurrentBlockPageData } from "@/types/requests/currentBlockPage"
 import type { TrackingData } from "@/types/requests/trackingData"
 

app/[lang]/(live-current)/layout.tsx

@@ -1,12 +1,14 @@
 import "@scandic-hotels/design-system/current/style.css"
 
+import Script from "next/script"
+
 import AdobeScript from "@/components/Current/AdobeScript"
 import Footer from "@/components/Current/Footer"
 import LangPopup from "@/components/Current/LangPopup"
-import Script from "next/script"
 import SkipToMainContent from "@/components/SkipToMainContent"
 
 import type { Metadata } from "next"
+
 import type { LangParams, LayoutArgs } from "@/types/params"
 
 export const fetchCache = "default-no-store"

app/[lang]/(preview)/layout.tsx

@@ -1,6 +1,7 @@
 import InitLivePreview from "@/components/Current/LivePreview"
 
 import type { Metadata } from "next"
+
 import type { LangParams, LayoutArgs } from "@/types/params"
 
 export const metadata: Metadata = {

app/[lang]/(preview-current)/layout.tsx

@@ -1,10 +1,12 @@
+import Script from "next/script"
+
 import Footer from "@/components/Current/Footer"
 import LangPopup from "@/components/Current/LangPopup"
-import Script from "next/script"
-import SkipToMainContent from "@/components/SkipToMainContent"
 import InitLivePreview from "@/components/Current/LivePreview"
+import SkipToMainContent from "@/components/SkipToMainContent"
 
 import type { Metadata } from "next"
+
 import type { LangParams, LayoutArgs } from "@/types/params"
 
 export const fetchCache = "default-no-store"

app/[lang]/(preview-current)/preview-current/page.tsx

@@ -1,11 +1,13 @@
+import ContentstackLivePreview from "@contentstack/live-preview-utils"
+
 import { previewRequest } from "@/lib/graphql/previewRequest"
 import { GetCurrentBlockPage } from "@/lib/graphql/Query/CurrentBlockPage.graphql"
 
-import type { PageArgs, LangParams, PreviewParams } from "@/types/params"
-import type { GetCurrentBlockPageData } from "@/types/requests/currentBlockPage"
-import ContentstackLivePreview from "@contentstack/live-preview-utils"
-import LoadingSpinner from "@/components/Current/LoadingSpinner"
 import ContentPage from "@/components/Current/ContentPage"
+import LoadingSpinner from "@/components/Current/LoadingSpinner"
+
+import type { LangParams, PageArgs, PreviewParams } from "@/types/params"
+import type { GetCurrentBlockPageData } from "@/types/requests/currentBlockPage"
 
 export default async function CurrentPreviewPage({
   params,

app/[lang]/(test)/layout.tsx

@@ -1,4 +1,5 @@
 import type { Metadata } from "next"
+
 import type { LangParams, LayoutArgs } from "@/types/params"
 
 export const metadata: Metadata = {

app/[lang]/webview/layout.tsx

@@ -1,4 +1,5 @@
 import type { Metadata } from "next"
+
 import type { LangParams, LayoutArgs } from "@/types/params"
 
 export const metadata: Metadata = {

app/api/web/revalidate/route.ts

@@ -1,8 +1,8 @@
-import { env } from "@/env/server"
 import { revalidateTag } from "next/cache"
-
 import { NextRequest } from "next/server"
 
+import { env } from "@/env/server"
+
 export async function POST(request: NextRequest) {
   try {
     const secret = request.nextUrl.searchParams.get("secret") ?? ""

components/Current/AdobeScript.tsx

@@ -1,7 +1,7 @@
-import { env } from "@/env/server"
-
 import Script from "next/script"
 
+import { env } from "@/env/server"
+
 export default function AdobeScript() {
   return env.ADOBE_SCRIPT_SRC ? (
     <Script data-cookieconsent="statistics" src={env.ADOBE_SCRIPT_SRC} />

components/Current/Aside/Contacts/Contact.tsx

@@ -1,7 +1,8 @@
+import { Lang } from "@/constants/languages"
+
 import styles from "./contact.module.css"
 
-import { Lang } from "@/constants/languages"
+import { type ContactNode, Section } from "@/types/requests/asides/contact"
-import { Section, type ContactNode } from "@/types/requests/asides/contact"
 
 export default function Contact({ sections, system: { locale } }: ContactNode) {
   if (!sections.length) {

components/Current/Aside/Puff/index.tsx

@@ -1,10 +1,12 @@
 "use client"
-import { renderOptions } from "./renderOptions"
 import { useRouter } from "next/navigation"
 
+import { Button } from "@scandic-hotels/design-system/current"
+
 import Image from "@/components/Image"
 import JsonToHtml from "@/components/JsonToHtml"
-import { Button } from "@scandic-hotels/design-system/current"
+
+import { renderOptions } from "./renderOptions"
 
 import styles from "./puff.module.css"
 

components/Current/Aside/Puff/renderOptions.tsx

@@ -1,9 +1,8 @@
 import styles from "./puff.module.css"
 
-import { RTETypeEnum } from "@/types/rte/enums"
-
 import type { EmbedByUid } from "@/types/components/jsontohtml"
-import type { RTENext, RTEDefaultNode } from "@/types/rte/node"
+import { RTETypeEnum } from "@/types/rte/enums"
+import type { RTEDefaultNode, RTENext } from "@/types/rte/node"
 import type { RenderOptions } from "@/types/rte/option"
 
 export const renderOptions: RenderOptions = {

components/Current/Aside/index.tsx

@@ -1,11 +1,11 @@
-import Puff from "./Puff"
 import Contacts from "./Contacts"
-
+import Puff from "./Puff"
-import { AsideTypenameEnum } from "@/types/requests/utils/typename"
-import type { AsideProps } from "@/types/components/current/aside"
 
 import styles from "./aside.module.css"
 
+import type { AsideProps } from "@/types/components/current/aside"
+import { AsideTypenameEnum } from "@/types/requests/utils/typename"
+
 export default function Aside({ blocks }: AsideProps) {
   if (!blocks?.length) {
     return null
@@ -24,12 +24,7 @@ export default function Aside({ blocks }: AsideProps) {
               />
             )
           case AsideTypenameEnum.CurrentBlocksPageAsidePuff:
-            return (
+            return <Puff key={`block-${idx}`} {...block.puff} />
-              <Puff
-                key={`block-${idx}`}
-                {...block.puff}
-              />
-            )
           default:
             return null
         }

components/Current/Blocks/List/ListItem.tsx

@@ -1,10 +1,9 @@
 import { cva } from "class-variance-authority"
 
-import { BlockListItemsEnum } from "@/types/requests/blocks/list"
-
 import styles from "./list.module.css"
 
 import type { ListItem } from "@/types/requests/blocks/list"
+import { BlockListItemsEnum } from "@/types/requests/blocks/list"
 
 const config = {
   variants: {

components/Current/Blocks/index.tsx

@@ -2,10 +2,10 @@ import List from "./List"
 import Puffs from "./Puffs"
 import Text from "./Text"
 
-import { BlocksTypenameEnum } from "@/types/requests/utils/typename"
-
 import styles from "./blocks.module.css"
+
 import type { BlocksProps } from "@/types/components/current/blocks"
+import { BlocksTypenameEnum } from "@/types/requests/utils/typename"
 
 export default function Blocks({ blocks }: BlocksProps) {
   if (!blocks?.length) {

components/Current/Footer/index.tsx

@@ -1,12 +1,14 @@
-import { request } from "@/lib/graphql/request"
-import { GetFooter } from "@/lib/graphql/Query/Footer.graphql"
-
-import Image from "@/components/Image"
-import Navigation from "./Navigation"
 import Script from "next/script"
 
-import type { GetFooterData } from "@/types/requests/footer"
+import { GetFooter } from "@/lib/graphql/Query/Footer.graphql"
+import { request } from "@/lib/graphql/request"
+
+import Image from "@/components/Image"
+
+import Navigation from "./Navigation"
+
 import type { LangParams } from "@/types/params"
+import type { GetFooterData } from "@/types/requests/footer"
 
 export default async function Footer({ lang }: LangParams) {
   const response = await request<GetFooterData>(

components/Current/Header/MainMenu/index.tsx

@@ -2,6 +2,7 @@
 import { useState } from "react"
 
 import Image from "@/components/Image"
+
 import Mobile from "../LanguageSwitcher/Mobile"
 
 import styles from "./mainMenu.module.css"

components/Current/Header/index.tsx

@@ -1,13 +1,13 @@
+import { homeHrefs } from "@/constants/homeHrefs"
 import { languages } from "@/constants/languages"
+import { env } from "@/env/server"
 import { batchRequest } from "@/lib/graphql/batchRequest"
-import { request } from "@/lib/graphql/request"
 import { GetHeader } from "@/lib/graphql/Query/Header.graphql"
 import {
   GetDaDeEnUrls,
   GetFiNoSvUrls,
 } from "@/lib/graphql/Query/LanguageSwitcher.graphql"
-import { homeHrefs } from "@/constants/homeHrefs"
+import { request } from "@/lib/graphql/request"
-import { env } from "@/env/server"
 
 import MainMenu from "./MainMenu"
 import OfflineBanner from "./OfflineBanner"
@@ -15,9 +15,9 @@ import TopMenu from "./TopMenu"
 
 import styles from "./header.module.css"
 
+import type { HeaderProps } from "@/types/components/current/header"
 import { LangParams } from "@/types/params"
 import type { HeaderQueryData } from "@/types/requests/header"
-import type { HeaderProps } from "@/types/components/current/header"
 import type { LanguageSwitcherQueryData } from "@/types/requests/languageSwitcher"
 
 export default async function Header({ lang, uid }: LangParams & HeaderProps) {

components/Current/LangPopup/index.tsx

@@ -1,6 +1,7 @@
-import { Lang, localeToLang } from "@/constants/languages"
 import { headers } from "next/headers"
 
+import { Lang, localeToLang } from "@/constants/languages"
+
 export default function LangPopup({ lang }: { lang: Lang }) {
   const headersList = headers()
   const preferedLang = headersList.get("Accept-Language") ?? ""

components/Current/LivePreview/index.tsx

@@ -1,7 +1,7 @@
 "use client"
 
-import { useEffect } from "react"
 import ContentstackLivePreview from "@contentstack/live-preview-utils"
+import { useEffect } from "react"
 
 export default function InitLivePreview() {
   useEffect(() => {

components/Current/Preamble/index.tsx

@@ -1,7 +1,7 @@
-import { renderOptions } from "./renderOptions"
+import JsonToHtml from "@/components/JsonToHtml"
 
 import Breadcrumbs from "./Breadcrumbs"
-import JsonToHtml from "@/components/JsonToHtml"
+import { renderOptions } from "./renderOptions"
 
 import styles from "./preamble.module.css"
 

components/Current/Preamble/renderOptions.tsx

@@ -1,9 +1,8 @@
 import styles from "./preamble.module.css"
 
-import { RTETypeEnum } from "@/types/rte/enums"
-
 import type { EmbedByUid } from "@/types/components/jsontohtml"
-import type { RTENext, RTEDefaultNode } from "@/types/rte/node"
+import { RTETypeEnum } from "@/types/rte/enums"
+import type { RTEDefaultNode, RTENext } from "@/types/rte/node"
 import type { RenderOptions } from "@/types/rte/option"
 
 export const renderOptions: RenderOptions = {

components/Current/Tracking.tsx

@@ -1,12 +1,13 @@
 "use client"
 
+import { usePathname, useSearchParams } from "next/navigation"
+import { useEffect, useState } from "react"
+
 import {
   SiteSectionObject,
   TrackingData,
   TrackingProps,
 } from "@/types/components/tracking"
-import { usePathname, useSearchParams } from "next/navigation"
-import { useEffect, useState } from "react"
 
 function createPageObject(trackingData: TrackingData) {
   const englishSegments = trackingData.englishUrl

components/Image/index.tsx

@@ -1,6 +1,8 @@
 "use client"
 
-import NextImage, { type ImageProps, type ImageLoaderProps } from "next/image"
+import NextImage from "next/image"
+
+import type { ImageLoaderProps, ImageProps } from "next/image"
 
 function imageLoader({ quality, src, width }: ImageLoaderProps) {
   return `${src}?w=${width}${quality ? "&q=" + quality : ""}`

components/JsonToHtml/renderOptions.tsx

@@ -1,20 +1,20 @@
-import Image from "@/components/Image"
 import Link from "next/link"
 
-import { EmbedEnum } from "@/types/requests/utils/embeds"
+import Image from "@/components/Image"
-import { RTEItemTypeEnum, RTETypeEnum } from "@/types/rte/enums"
-import { RTEMarkType } from "@/types/rte/node"
 
 import styles from "./jsontohtml.module.css"
 
-import type { Attributes } from "@/types/rte/attrs"
 import type { EmbedByUid } from "@/types/components/jsontohtml"
+import { EmbedEnum } from "@/types/requests/utils/embeds"
+import type { Attributes } from "@/types/rte/attrs"
+import { RTEItemTypeEnum, RTETypeEnum } from "@/types/rte/enums"
 import type {
-  RTENext,
   RTEDefaultNode,
+  RTENext,
   RTENode,
   RTERegularNode,
 } from "@/types/rte/node"
+import { RTEMarkType } from "@/types/rte/node"
 import type { RenderOptions } from "@/types/rte/option"
 
 function extractPossibleAttributes(attrs: Attributes) {
@@ -263,7 +263,9 @@ export const renderOptions: RenderOptions = {
         }
       } else {
         const props = extractPossibleAttributes(node.attrs)
-        const href = node.attrs?.locale ? `/${node.attrs.locale}${node.attrs.href}` : node.attrs.href
+        const href = node.attrs?.locale
+          ? `/${node.attrs.locale}${node.attrs.href}`
+          : node.attrs.href
         return (
           <Link {...props} href={href} key={node.uid}>
             {next(node.children, embeds, fullRenderOptions)}

components/JsonToHtml/utils.tsx

@@ -1,17 +1,16 @@
 import { renderOptions } from "./renderOptions"
 
-import { RTEMarkType, RTERenderMark } from "@/types/rte/node"
-import { RTETypeEnum } from "@/types/rte/enums"
-
 import type { EmbedByUid } from "@/types/components/jsontohtml"
+import type { Embeds } from "@/types/requests/embeds"
 import type { Node } from "@/types/requests/utils/edges"
-import type { RenderOptions } from "@/types/rte/option"
+import { RTETypeEnum } from "@/types/rte/enums"
 import type {
   RTENode,
-  RTETextNode,
   RTERenderOptionComponent,
+  RTETextNode,
 } from "@/types/rte/node"
-import type { Embeds } from "@/types/requests/embeds"
+import { RTEMarkType, RTERenderMark } from "@/types/rte/node"
+import type { RenderOptions } from "@/types/rte/option"
 
 export function groupEmbedsByUid(embedsArray: Node<Embeds>[]) {
   const embedsByUid = embedsArray.reduce<EmbedByUid>((acc, embed) => {

components/MyPages/Blocks/Benefits/CurrentLevel/index.tsx

@@ -1,8 +1,11 @@
-import { serverClient } from "@/lib/trpc/server"
-import Title from "@/components/MyPages/Title"
-import styles from "./current.module.css"
 import Link from "next/link"
 
+import { serverClient } from "@/lib/trpc/server"
+
+import Title from "@/components/MyPages/Title"
+
+import styles from "./current.module.css"
+
 export default async function CurrentBenefitsBlock() {
   const benefits = await serverClient().user.benefits.current()
 

components/MyPages/Blocks/Benefits/NextLevel/index.tsx

@@ -1,9 +1,10 @@
+import Link from "next/link"
+import { Lock } from "react-feather"
+
 import { serverClient } from "@/lib/trpc/server"
 
-import { Lock } from "react-feather"
 import Title from "@/components/MyPages/Title"
 import Button from "@/components/TempDesignSystem/Button"
-import Link from "next/link"
 
 import styles from "./next.module.css"
 

components/MyPages/Blocks/Overview/Buttons/CopyButton.tsx

@@ -1,7 +1,7 @@
 "use client"
 
-import Button from "@/components/TempDesignSystem/Button"
 import Image from "@/components/Image"
+import Button from "@/components/TempDesignSystem/Button"
 
 import type { User } from "@/types/user"
 

components/MyPages/Blocks/Overview/Buttons/MembershipCardButton.tsx

@@ -1,7 +1,7 @@
 "use client"
 
-import Button from "@/components/TempDesignSystem/Button"
 import Image from "@/components/Image"
+import Button from "@/components/TempDesignSystem/Button"
 
 import styles from "./btn.module.css"
 

components/MyPages/Blocks/Overview/Stats/Progress/index.tsx

@@ -1,4 +1,5 @@
 import Divider from "@/components/TempDesignSystem/Divider"
+
 import Title from "../Title"
 
 import styles from "./progress.module.css"

components/MyPages/Blocks/Overview/Stats/TotalPoints/index.tsx

@@ -1,4 +1,5 @@
 import Divider from "@/components/TempDesignSystem/Divider"
+
 import Title from "../Title"
 
 import styles from "./totalPoints.module.css"

components/MyPages/Blocks/Overview/UpcomingStays/index.tsx

@@ -1,9 +1,10 @@
 import { serverClient } from "@/lib/trpc/server"
 
-import Link from "@/components/TempDesignSystem/Link"
 import Title from "@/components/MyPages/Title"
-import StayCard from "../../Stays/StayCard"
+import Link from "@/components/TempDesignSystem/Link"
+
 import EmptyUpcomingStaysBlock from "../../Stays/EmptyUpcomingStays"
+import StayCard from "../../Stays/StayCard"
 
 import styles from "./upcoming.module.css"
 

components/MyPages/Blocks/Overview/index.tsx

@@ -1,6 +1,7 @@
+import Title from "@/components/MyPages/Title"
+
 import Friend from "./Friend"
 import Stats from "./Stats"
-import Title from "@/components/MyPages/Title"
 
 import styles from "./overview.module.css"
 

components/MyPages/Blocks/Shortcuts/index.tsx

@@ -1,5 +1,6 @@
-import Image from "@/components/Image"
 import Link from "next/link"
+
+import Image from "@/components/Image"
 import Title from "@/components/MyPages/Title"
 
 import styles from "./shortcuts.module.css"

components/MyPages/Blocks/Stays/EmptyPreviousStays/index.tsx

@@ -1,4 +1,5 @@
 import Title from "@/components/MyPages/Title"
+
 import styles from "./emptyPreviousStays.module.css"
 
 export default function EmptyPreviousStaysBlock() {

components/MyPages/Blocks/Stays/EmptyUpcomingStays/index.tsx

@@ -1,7 +1,9 @@
+import Link from "next/link"
+
 import Title from "@/components/MyPages/Title"
 import Button from "@/components/TempDesignSystem/Button"
+
 import styles from "./emptyUpcomingStays.module.css"
-import Link from "next/link"
 
 export default function EmptyUpcomingStaysBlock() {
   return (

components/MyPages/Blocks/Stays/StayCard/index.tsx

@@ -1,8 +1,9 @@
 import { dt } from "@/lib/dt"
+
 import Image from "@/components/Image"
+import Title from "@/components/MyPages/Title"
 
 import styles from "./stay.module.css"
-import Title from "@/components/MyPages/Title"
 
 import type { StayCardProps } from "@/types/components/myPages/stays/stayCard"
 

components/MyPages/Blocks/Stays/StayList/index.tsx

@@ -1,4 +1,5 @@
 import Button from "@/components/TempDesignSystem/Button"
+
 import StayCard from "../StayCard"
 
 import styles from "./stayList.module.css"

components/MyPages/Header/LanguageSwitcher/index.tsx

@@ -1,4 +1,5 @@
 import Image from "@/components/Image"
+
 import styles from "./language.module.css"
 
 export default function LanguageSwitcher() {

components/MyPages/Header/Logo/index.tsx

@@ -1,8 +1,9 @@
-import { request } from "@/lib/graphql/request"
+import Link from "next/link"
+
 import { GetMyPagesLogo } from "@/lib/graphql/Query/Logo.graphql"
+import { request } from "@/lib/graphql/request"
 
 import Image from "@/components/Image"
-import Link from "next/link"
 
 import styles from "./logo.module.css"
 

components/MyPages/Header/User/index.tsx

@@ -1,4 +1,5 @@
 import { serverClient } from "@/lib/trpc/server"
+
 import styles from "./user.module.css"
 
 export default async function User() {

components/MyPages/Sidebar/helpers.ts

@@ -1,6 +1,6 @@
 import type {
-  NavigationItem,
   MenuItem,
+  NavigationItem,
 } from "@/types/requests/myPages/navigation"
 
 export function mapMenuItems(navigationItems: NavigationItem[]) {

components/MyPages/Sidebar/index.tsx

@@ -1,16 +1,20 @@
-import { mapMenuItems } from "./helpers"
-import { request } from "@/lib/graphql/request"
-import { GetNavigationMyPages } from "@/lib/graphql/Query/NavigationMyPages.graphql"
-
 import { Fragment } from "react"
 import { LogOut } from "react-feather"
+
+import { GetNavigationMyPages } from "@/lib/graphql/Query/NavigationMyPages.graphql"
+import { request } from "@/lib/graphql/request"
+
 import Link from "@/components/TempDesignSystem/Link"
+
 import Title from "../Title"
+import { mapMenuItems } from "./helpers"
 
 import styles from "./sidebar.module.css"
 
-import type { GetNavigationMyPagesData } from "@/types/requests/myPages/navigation"
+import type {
-import type { SidebarProps } from "@/types/requests/myPages/navigation"
+  GetNavigationMyPagesData,
+  SidebarProps,
+} from "@/types/requests/myPages/navigation"
 
 export default async function Sidebar({ lang }: SidebarProps) {
   const response = await request<GetNavigationMyPagesData>(

components/MyProfile/Profile/Container.tsx

@@ -1,7 +1,7 @@
 import { cva } from "class-variance-authority"
 
-import Card from "@/components/MyProfile/Card"
 import Image from "@/components/Image"
+import Card from "@/components/MyProfile/Card"
 
 import styles from "./profile.module.css"
 

components/MyProfile/Profile/Edit/Form/Content.tsx

@@ -12,9 +12,9 @@ import {
   HouseIcon,
   PhoneIcon,
 } from "@/components/Icons"
+import Field from "@/components/MyProfile/Field"
 import CountrySelect from "@/components/TempDesignSystem/Form/Country"
 import DateSelect from "@/components/TempDesignSystem/Form/Date"
-import Field from "@/components/MyProfile/Field"
 import Input from "@/components/TempDesignSystem/Form/Input"
 import Phone from "@/components/TempDesignSystem/Form/Phone"
 

components/MyProfile/Profile/Edit/Form/index.tsx

@@ -1,14 +1,15 @@
 "use client"
-import { FormProvider, useForm } from "react-hook-form"
-import { useFormState as useReactFormState } from "react-dom"
-import { useEffect } from "react"
 import { zodResolver } from "@hookform/resolvers/zod"
+import { useEffect } from "react"
+import { useFormState as useReactFormState } from "react-dom"
+import { FormProvider, useForm } from "react-hook-form"
 
-import { editProfile } from "@/actions/editProfile"
-import { editProfileSchema, type EditProfileSchema } from "./schema"
 import { useProfileStore } from "@/stores/edit-profile"
 
+import { editProfile } from "@/actions/editProfile"
+
 import FormContent from "./Content"
+import { type EditProfileSchema, editProfileSchema } from "./schema"
 
 import styles from "./form.module.css"
 

components/MyProfile/Profile/Edit/Form/schema.ts

@@ -1,6 +1,7 @@
 import { z } from "zod"
 
 import { _ } from "@/lib/translation"
+
 import { phoneValidator } from "@/utils/phoneValidator"
 
 export const editProfileSchema = z.object({

components/MyProfile/Profile/index.tsx

@@ -1,5 +1,6 @@
+import { dt } from "@/lib/dt"
 import { _ } from "@/lib/translation"
-import { countries } from "@/components/TempDesignSystem/Form/Country/countries"
+import { serverClient } from "@/lib/trpc/server"
 
 import {
   CalendarIcon,
@@ -7,14 +8,13 @@ import {
   HouseIcon,
   PhoneIcon,
 } from "@/components/Icons"
-import Container from "./Container"
+import { countries } from "@/components/TempDesignSystem/Form/Country/countries"
+
 import Field from "../Field"
+import Container from "./Container"
 
 import styles from "./profile.module.css"
 
-import { serverClient } from "@/lib/trpc/server"
-import { dt } from "@/lib/dt"
-
 export default async function Profile() {
   const user = await serverClient().user.get()
   const countryName = countries.find(

components/TempDesignSystem/Form/Country/index.tsx

@@ -1,22 +1,22 @@
 "use client"
-import { useController, useFormContext } from "react-hook-form"
+import { ErrorMessage } from "@hookform/error-message"
 import { useRef } from "react"
-
-import { _ } from "@/lib/translation"
-import { countries } from "./countries"
-
 import {
   Button,
   ComboBox,
   FieldError,
   Input,
+  type Key,
   ListBox,
   ListBoxItem,
   Popover,
-  type Key,
 } from "react-aria-components"
-import { ErrorMessage } from "@hookform/error-message"
+import { useController, useFormContext } from "react-hook-form"
+
+import { _ } from "@/lib/translation"
+
 import SelectChevron from "../SelectChevron"
+import { countries } from "./countries"
 
 import styles from "./country.module.css"
 

components/TempDesignSystem/Form/Date/Select/index.tsx

@@ -1,16 +1,16 @@
 "use client"
 import { useRef } from "react"
-
 import {
   Button,
+  type Key,
   Label,
   ListBox,
   ListBoxItem,
   Popover,
   Select as ReactAriaSelect,
   SelectValue,
-  type Key,
 } from "react-aria-components"
+
 import SelectChevron from "../../SelectChevron"
 
 import styles from "./select.module.css"

components/TempDesignSystem/Form/Date/date.ts

@@ -1,4 +1,5 @@
 import type { Control, RegisterOptions } from "react-hook-form"
+
 import type { EditProfileSchema } from "@/components/MyProfile/Profile/Edit/Form/schema"
 
 export interface DateProps

components/TempDesignSystem/Form/Date/index.tsx

@@ -1,25 +1,27 @@
 "use client"
 import { parseDate } from "@internationalized/date"
-import { useController, useFormContext, useWatch } from "react-hook-form"
-
-import { _ } from "@/lib/translation"
-import { dt } from "@/lib/dt"
-import { rangeArray } from "@/utils/rangeArray"
-
 import {
   DateInput,
   DatePicker,
   DateSegment,
   Group,
 } from "react-aria-components"
+import { useController, useFormContext, useWatch } from "react-hook-form"
+
+import { dt } from "@/lib/dt"
+import { _ } from "@/lib/translation"
+
+import { rangeArray } from "@/utils/rangeArray"
+
+import { DateName } from "./Select/select"
 import Select from "./Select"
 
 import styles from "./date.module.css"
 
-import { DateName } from "./Select/select"
-import type { DateProps } from "./date"
 import type { Key } from "react-aria-components"
 
+import type { DateProps } from "./date"
+
 /** TODO: Get selecting with Enter-key to work */
 export default function DateSelect({
   control,

components/TempDesignSystem/Form/ErrorMessage/errorMessage.ts

@@ -1,4 +1,4 @@
-import { FieldValuesFromFieldErrors } from "@hookform/error-message"
+import type { FieldValuesFromFieldErrors } from "@hookform/error-message"
 import type {
   FieldErrors,
   FieldName,

components/TempDesignSystem/Form/Input/index.tsx

@@ -1,8 +1,8 @@
 "use client"
+import { Input as AriaInput, TextField } from "react-aria-components"
 import { useController } from "react-hook-form"
 
 import ErrorMessage from "@/components/TempDesignSystem/Form/ErrorMessage"
-import { Input as AriaInput, TextField } from "react-aria-components"
 
 import styles from "./input.module.css"
 

components/TempDesignSystem/Form/Input/input.ts

@@ -1,6 +1,7 @@
-import { EditProfileSchema } from "@/components/MyProfile/Profile/Edit/Form/schema"
 import { Control, RegisterOptions } from "react-hook-form"
 
+import { EditProfileSchema } from "@/components/MyProfile/Profile/Edit/Form/schema"
+
 export interface InputProps
   extends React.InputHTMLAttributes<HTMLInputElement> {
   control: Control<EditProfileSchema>

components/TempDesignSystem/Form/Phone/index.tsx

@@ -1,11 +1,12 @@
 "use client"
 import "react-international-phone/style.css"
-import { useController, useFormContext, useWatch } from "react-hook-form"
+
 import { useCallback, useEffect, useRef } from "react"
+import { useController, useFormContext, useWatch } from "react-hook-form"
 import { defaultCountries, getCountry } from "react-international-phone"
+import { PhoneInput, type PhoneInputRefType } from "react-international-phone"
 
 import ErrorMessage from "@/components/TempDesignSystem/Form/ErrorMessage"
-import { PhoneInput, type PhoneInputRefType } from "react-international-phone"
 
 import styles from "./phone.module.css"
 

components/TempDesignSystem/Link/index.tsx

@@ -1,10 +1,9 @@
 "use client"
+import NextLink from "next/link"
 import { usePathname } from "next/navigation"
 
 import { linkVariants } from "./variants"
 
-import NextLink from "next/link"
-
 import type { LinkProps } from "./link"
 
 export default function Link({

lib/dt.ts

@@ -1,12 +1,12 @@
-import d from "dayjs"
-import isToday from "dayjs/plugin/isToday"
-import relativeTime from "dayjs/plugin/relativeTime"
-
 import "dayjs/locale/da"
 import "dayjs/locale/de"
 import "dayjs/locale/fi"
 import "dayjs/locale/sv"
 
+import d from "dayjs"
+import isToday from "dayjs/plugin/isToday"
+import relativeTime from "dayjs/plugin/relativeTime"
+
 /**
  *  dayjs export Norwegian as nb [Norwegian Bokmål] so here we create the same
  *  setup as nb has.

lib/graphql/batchRequest.ts

@@ -1,9 +1,11 @@
 import "server-only"
+
 import { request } from "./request"
 
-import type { Data } from "@/types/request"
 import type { BatchRequestDocument } from "graphql-request"
 
+import type { Data } from "@/types/request"
+
 export async function batchRequest<T>(
   queries: (BatchRequestDocument & NextFetchRequestConfig)[]
 ): Promise<Data<T>> {

lib/graphql/previewRequest.ts

@@ -1,11 +1,13 @@
 import "server-only"
+
+import ContentstackLivePreview from "@contentstack/live-preview-utils"
 import { request as graphqlRequest } from "graphql-request"
 
 import { env } from "@/env/server"
-import ContentstackLivePreview from "@contentstack/live-preview-utils"
+
+import type { DocumentNode } from "graphql"
 
 import type { Data } from "@/types/request"
-import type { DocumentNode } from "graphql"
 
 export async function previewRequest<T>(
   query: string | DocumentNode,

lib/graphql/request.ts

@@ -1,11 +1,14 @@
 import "server-only"
+
 import { GraphQLClient } from "graphql-request"
-import { env } from "@/env/server"
 import { cache } from "react"
 
-import type { Data } from "@/types/request"
+import { env } from "@/env/server"
+
 import type { DocumentNode } from "graphql"
 
+import type { Data } from "@/types/request"
+
 const client = new GraphQLClient(env.CMS_URL, {
   fetch: cache(async function (
     url: URL | RequestInfo,

lib/trpc/Provider.tsx

@@ -1,12 +1,14 @@
 "use client"
 
-import { useState } from "react"
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
 import { httpBatchLink } from "@trpc/client"
+import { useState } from "react"
+
 import { env } from "@/env/client"
-import { trpc } from "./client"
 import { transformer } from "@/server/transformer"
 
+import { trpc } from "./client"
+
 function initializeTrpcClient() {
   return trpc.createClient({
     links: [

lint-staged.config.js

@@ -2,7 +2,7 @@ import path from "node:path"
 
 // https://nextjs.org/docs/app/building-your-application/configuring/eslint#lint-staged
 const buildEslintCommand = (filenames) =>
-  `next lint --max-warnings 0 --file ${filenames
+  `next lint --fix --max-warnings 0 --file ${filenames
     .map((f) => path.relative(process.cwd(), f))
     .join(" --file ")}`
 

package-lock.json

@@ -47,6 +47,8 @@
         "dotenv": "^16.4.5",
         "eslint": "^8",
         "eslint-config-next": "^14.0.4",
+        "eslint-plugin-import": "^2.29.1",
+        "eslint-plugin-simple-import-sort": "^12.1.0",
         "husky": "^9.0.11",
         "jiti": "^1.21.0",
         "lint-staged": "^15.2.2",
@@ -4819,6 +4821,15 @@
         "semver": "bin/semver.js"
       }
     },
+    "node_modules/eslint-plugin-simple-import-sort": {
+      "version": "12.1.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-simple-import-sort/-/eslint-plugin-simple-import-sort-12.1.0.tgz",
+      "integrity": "sha512-Y2fqAfC11TcG/WP3TrI1Gi3p3nc8XJyEOJYHyEPEGI/UAgNx6akxxlX74p7SbAQdLcgASKhj8M0GKvH3vq/+ig==",
+      "dev": true,
+      "peerDependencies": {
+        "eslint": ">=5.0.0"
+      }
+    },
     "node_modules/eslint-scope": {
       "version": "7.2.2",
       "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",

package.json

@@ -4,10 +4,14 @@
   "private": true,
   "type": "module",
   "scripts": {
+    "prebuild": "npm run lint",
     "build": "next build",
     "predev": "rm -rf .next",
     "dev": "next dev",
-    "lint": "next lint && tsc",
+    "prelint": "rm -rf .next",
+    "lint": "next lint --max-warnings 0 && tsc",
+    "prelint:fix": "rm -rf .next",
+    "lint:fix": "next lint --fix --max-warnings 0 && tsc",
     "prepare": "husky",
     "start": "node .next/standalone/server.js",
     "test:component": "cypress open --component",
@@ -56,6 +60,8 @@
     "dotenv": "^16.4.5",
     "eslint": "^8",
     "eslint-config-next": "^14.0.4",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-simple-import-sort": "^12.1.0",
     "husky": "^9.0.11",
     "jiti": "^1.21.0",
     "lint-staged": "^15.2.2",