Merged in chore/eslint-curly-braces (pull request #3304)

Chore/eslint curly braces

* Add eslint rule for curly braces

* run eslint --fix for all files


Approved-by: Linus Flood

apps/partner-sas/app/[lang]/page.tsx

@@ -38,7 +38,7 @@ export default async function Home(props: PageArgs<LangParams>) {
       <section className={styles.mainContent}>
         <div className={styles.contentContainer}>
           <section className={styles.bookingWidgetWrapper}>
-            <Typography variant={"Title/lg"}>
+            <Typography variant="Title/lg">
               <h1 className={styles.heading}>
                 {intl.formatMessage({
                   id: "partnerSas.startPage.heading",
@@ -64,7 +64,7 @@ export default async function Home(props: PageArgs<LangParams>) {
                   defaultMessage:
                     "Collect new SAS EuroBonus points with your bookings.",
                 })}
-                theme={"SAS-Blue"}
+                theme="SAS-Blue"
                 icon={IconName.Diamond}
               />
               <InfoBox
@@ -77,7 +77,7 @@ export default async function Home(props: PageArgs<LangParams>) {
                   defaultMessage:
                     "Then use your points to pay for your next Scandic stay!",
                 })}
-                theme={"SAS-Blue"}
+                theme="SAS-Blue"
                 icon={IconName.CreditCard}
               />
             </section>

apps/partner-sas/app/global-error.tsx

@@ -64,9 +64,8 @@ export default function GlobalError({
 
           <p>
             <strong>
-              {
-                "While we're working hard to fix it, you can always give us a call:"
-              }
+              While we&apos;re working hard to fix it, you can always give us a
+              call:
             </strong>
           </p>
 

apps/partner-sas/components/LanguageSwitcher/index.tsx

@@ -61,12 +61,12 @@ export function LanguageSwitcher({
   return (
     <div className={classNames}>
       <DialogTrigger>
-        <Button className={styles.triggerButton} variant={"Text"} wrapping>
+        <Button className={styles.triggerButton} variant="Text" wrapping>
           {isMobile && !isFooter ? null : (
             <MaterialIcon
               icon="globe"
               size={16}
-              color={"Icon/Inverted"}
+              color="Icon/Inverted"
               className={styles.globeIcon}
             />
           )}
@@ -109,7 +109,7 @@ export function LanguageSwitcher({
           <Popover
             offset={isFooter ? 0 : 21}
             className={styles.languageSwitcherPopover}
-            placement={"bottom right"}
+            placement="bottom right"
           >
             <Dialog>
               {({ close }) => (
@@ -158,8 +158,8 @@ function LanguageSwitcherContent({
         <>
           <div className={styles.closeModalWrapper}>
             <Button
-              variant={"Text"}
-              size={"Medium"}
+              variant="Text"
+              size="Medium"
               onPress={closeModal}
               className={styles.closeModal}
             >
@@ -167,17 +167,17 @@ function LanguageSwitcherContent({
                 icon="chevron_left"
                 size={28}
                 className={styles.arrowBackIcon}
-                color={"CurrentColor"}
+                color="CurrentColor"
               />
               <MaterialIcon
                 icon="close"
                 size={32}
                 className={styles.closeIcon}
-                color={"CurrentColor"}
+                color="CurrentColor"
               />
             </Button>
           </div>
-          <Typography variant={"Title/Subtitle/md"}>
+          <Typography variant="Title/Subtitle/md">
             <h3 className={styles.title}>
               {intl.formatMessage({
                 id: "common.selectYourLanguage",

apps/partner-sas/components/Menu/MobileMenu/index.tsx

@@ -35,7 +35,7 @@ export function MobileMenu({ children }: React.PropsWithChildren) {
       />
       <div id="close-menu-container" style={{ position: "relative" }}>
         <Button
-          variant={"Text"}
+          variant="Text"
           type="button"
           className={`${styles.hamburger} ${isOpen ? styles.isExpanded : ""}`}
           aria-label={isOpen ? closeMsg : openMsg}

apps/partner-sas/components/Menu/NavigationMenu/index.tsx

@@ -36,7 +36,7 @@ export function NavigationMenu({ isMobile = false }: { isMobile?: boolean }) {
           className={`${styles.menuItem} ${styles.contactLink}`}
         >
           {isMobile ? null : (
-            <MaterialIcon icon="call" size={16} color={"CurrentColor"} />
+            <MaterialIcon icon="call" size={16} color="CurrentColor" />
           )}
           {intl.formatMessage({
             id: "common.contactUs",

apps/partner-sas/components/Menu/UserMenu/index.tsx

@@ -58,9 +58,9 @@ export function UserMenu({
     <div className={styles.userMenu}>
       {(session.status === "loading" || isLoading) &&
         (isMobile ? (
-          <SkeletonShimmer width={"4ch"} height={"4ch"} />
+          <SkeletonShimmer width="4ch" height="4ch" />
         ) : (
-          <SkeletonShimmer width={"12ch"} height={"1ch"} />
+          <SkeletonShimmer width="12ch" height="1ch" />
         ))}
       {(session.status === "unauthenticated" || isError) && (
         <a href={loginLink} className={styles.loginLink}>
@@ -86,7 +86,7 @@ export function UserMenu({
       {session.status === "authenticated" && isSuccess && profileData && (
         <div>
           <DialogTrigger onOpenChange={onOpenChange} isOpen={isOpen}>
-            <Button className={styles.userName} variant={"Text"}>
+            <Button className={styles.userName} variant="Text">
               <Avatar
                 className={styles.avatar}
                 initials={getInitials(
@@ -153,7 +153,7 @@ function UserMenuContent({
     <>
       <div>
         {isMobile && (
-          <Typography variant={"Title/Subtitle/md"}>
+          <Typography variant="Title/Subtitle/md">
             <h3 data-hj-suppress>
               {intl.formatMessage(
                 {
@@ -176,7 +176,7 @@ function UserMenuContent({
           </Typography>
           <Typography variant="Title/Overline/sm">
             {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
-            <span>{"·"}</span>
+            <span>·</span>
           </Typography>
           <Typography variant="Body/Paragraph/mdRegular">
             <span>
@@ -194,7 +194,7 @@ function UserMenuContent({
         </p>
       </div>
       <Divider className={styles.menuDivider} />
-      <Typography variant={"Link/md"} className={styles.logoutLink}>
+      <Typography variant="Link/md" className={styles.logoutLink}>
         {/* Link triggers rsc which doesn't reload complete page and shows logged in even after logout  */}
         <a href={`/${lang}/logout`}>
           {intl.formatMessage({

apps/partner-sas/eslint.config.mjs

@@ -47,6 +47,14 @@ export default defineConfig([
       "no-console": "warn",
       "no-unused-vars": "off",
       "react/function-component-definition": "error",
+      "react/jsx-curly-brace-presence": [
+        "error",
+        {
+          props: "never",
+          children: "never",
+          propElementValues: "always",
+        },
+      ],
       "import/no-relative-packages": "error",
       "simple-import-sort/imports": [
         "warn",

apps/partner-sas/package.json

@@ -7,8 +7,8 @@
     "dev": "NODE_OPTIONS=--openssl-legacy-provider PORT=3001 NEXT_PUBLIC_PORT=3001 next dev --turbo",
     "build": "next build",
     "start": "node .next/standalone/server.js",
-    "lint": "eslint --max-warnings 0 . && tsgo --noEmit",
-    "lint:fix": "eslint --fix . && tsgo --noEmit",
+    "lint": "eslint --max-warnings 0 .",
+    "lint:fix": "eslint --fix .",
     "check-types": "tsgo --noEmit",
     "typegen": "next typegen",
     "clean": "rm -rf .next",