fix(BOOK-325): Added refetch options to user.name query and refactored header

Approved-by: Linus Flood Approved-by: Matilda Landström
2025-11-13 06:33:47 +00:00
parent 3a45e6cfe3
commit c4b564998c
27 changed files with 395 additions and 347 deletions
@@ -0,0 +1,28 @@
+import { cx } from "class-variance-authority"
+import NextLink from "next/link"
+
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
+import { Typography } from "@scandic-hotels/design-system/Typography"
+
+import styles from "./menuLink.module.css"
+
+import type { ComponentProps } from "react"
+
+export function MenuLink({
+  className,
+  children,
+  ...props
+}: ComponentProps<typeof NextLink>) {
+  return (
+    <Typography variant="Body/Paragraph/mdRegular">
+      <NextLink className={cx(styles.menuLink, className)} {...props}>
+        {children}
+        <MaterialIcon
+          icon="arrow_forward"
+          color="CurrentColor"
+          className={styles.arrowIcon}
+        />
+      </NextLink>
+    </Typography>
+  )
+}
@@ -0,0 +1,27 @@
+.menuLink {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  padding: var(--Space-x1);
+  gap: var(--Space-x15);
+  border-radius: var(--Corner-radius-md);
+  color: var(--Text-Interactive-Default);
+
+  &:hover {
+    background-color: var(--Surface-Primary-Hover);
+  }
+
+  &:focus-visible {
+    outline: 2px auto -webkit-focus-ring-color;
+    outline-offset: 1px;
+  }
+
+  &:not(:hover) .arrowIcon {
+    opacity: 0;
+  }
+}
+
+.arrowIcon {
+  flex-shrink: 0;
+}