Merge main

components/GridRep/index.tsx

@@ -248,7 +248,7 @@ const GridRep = (props: Props) => {
   )
 
   return (
-    <Link href={`/p/${props.shortcode}`}>
+    <Link legacyBehavior href={`/p/${props.shortcode}`}>
       <a className={styles.gridRep}>
         {detailsWithUsername}
         <div className={styles.weaponGrid}>

components/about/LinkItem/index.tsx

@@ -21,7 +21,7 @@ const LinkItem = ({ icon, title, link, className, ...props }: Props) => {
 
   return (
     <div className={classes}>
-      <Link href={link}>
+      <Link legacyBehavior href={link}>
         <a href={link} target="_blank" rel="noreferrer">
           <div className={styles.left}>
             <i className={styles.icon}>{icon}</i>

components/about/UpdatesPage/index.tsx

@@ -57,6 +57,67 @@ const UpdatesPage = () => {
   return (
     <div className={classes}>
       <h1>{common('about.segmented_control.updates')}</h1>
+      <ContentUpdate
+        version="2023-08F"
+        dateString="2023/08/16"
+        event="events.flash"
+        newItems={{
+          character: ['3040478000', '3040479000', '3040480000'],
+          weapon: ['1040915400', '1040024800', '1040422000'],
+          summon: ['2040423000'],
+        }}
+        uncappedItems={{
+          character: ['3040161000', '3040165000'],
+        }}
+        numNotes={1}
+      />
+      <ContentUpdate
+        version="2023-08U"
+        dateString="2023/08/11"
+        event="events.content"
+        newItems={{
+          character: ['3040476000', '3040477000'],
+          weapon: ['1040117100'],
+          summon: ['2040422000', '2040421000'],
+        }}
+      />
+      <ContentUpdate
+        version="2023-07L"
+        dateString="2023/07/31"
+        event="events.legfest"
+        newItems={{
+          character: ['3040472000', '3040474000', '3040475000', '3040473000'],
+          weapon: [
+            '1040815800',
+            '1040024700',
+            '1040516200',
+            '1040218600',
+            '1040617600',
+            '1030305800',
+          ],
+          summon: ['2040420000'],
+        }}
+      />
+      <ContentUpdate
+        version="2023-07F"
+        dateString="2023/07/15"
+        event="events.flash"
+        newItems={{
+          character: ['3040470000', '3040471000'],
+          weapon: ['1040316300', '1040516100'],
+        }}
+      />
+      <ContentUpdate
+        version="2023-07U"
+        dateString="2023/07/08"
+        event="events.uncap"
+        newItems={{
+          weapon: ['1040218500'],
+        }}
+        uncappedItems={{
+          character: ['3040102000'],
+        }}
+      />
       <ContentUpdate
         version="2023-06L"
         dateString="2023/06/29"

components/common/DialogContent/index.tsx

@@ -12,8 +12,13 @@ interface Props
     HTMLDivElement
   > {
   wrapperClassName?: string
+<<<<<<< HEAD
   headerRef?: React.RefObject<HTMLDivElement>
   footerRef?: React.RefObject<HTMLDivElement>
+=======
+  headerref?: React.RefObject<HTMLDivElement>
+  footerref?: React.RefObject<HTMLDivElement>
+>>>>>>> main
   scrollable?: boolean
   onEscapeKeyDown: (event: KeyboardEvent) => void
   onOpenAutoFocus: (event: Event) => void

components/common/Editor/index.module.scss

@@ -22,8 +22,6 @@
     color: var(--text-primary);
     display: block;
     flex-grow: 1;
-    font-family: system-ui, -apple-system, 'Helvetica Neue', Helvetica, Arial,
-      sans-serif;
     font-size: $font-regular;
     line-height: 1.4;
     overflow: scroll;

components/party/PartyHeader/index.tsx

@@ -183,7 +183,7 @@ const PartyHeader = (props: Props) => {
   ) => {
     return (
       <div>
-        <Link href={`/${username}`} passHref>
+        <Link legacyBehavior href={`/${username}`} passHref>
           <a className={linkClass}>{userBlock(username, picture, element)}</a>
         </Link>
       </div>
@@ -193,7 +193,7 @@ const PartyHeader = (props: Props) => {
   const linkedRaidBlock = (raid: Raid) => {
     return (
       <div>
-        <Link href={`/teams?raid=${raid.slug}`} passHref>
+        <Link legacyBehavior href={`/teams?raid=${raid.slug}`} passHref>
           <a className={`Raid ${linkClass}`}>{raid.name[locale]}</a>
         </Link>
       </div>

package.json

@@ -13,6 +13,7 @@
     "build-storybook": "storybook build"
   },
   "dependencies": {
+    "@next/font": "^13.4.19",
     "@radix-ui/react-alert-dialog": "^1.0.2",
     "@radix-ui/react-dialog": "^1.0.2",
     "@radix-ui/react-dropdown-menu": "^2.0.1",
@@ -53,19 +54,20 @@
     "lodash.debounce": "^4.0.8",
     "lodash.isequal": "^4.5.0",
     "meyer-reset-scss": "^2.0.4",
-    "next": "12.0.8",
+    "next": "^13.4.19",
     "next-i18next": "^10.5.0",
     "next-themes": "^0.2.1",
     "next-usequerystate": "^1.7.0",
     "pluralize": "^8.0.0",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "react-i18next": "^11.15.5",
     "react-infinite-scroll-component": "^6.1.0",
     "react-linkify": "^1.0.0-alpha",
     "react-lite-youtube-embed": "^2.3.52",
     "react-scroll": "^1.8.5",
     "react-string-replace": "^1.1.0",
+    "react-use": "^17.4.0",
     "remixicon-react": "^1.0.0",
     "resolve-url-loader": "^5.0.0",
     "sanitize-html": "^2.8.1",
@@ -99,7 +101,7 @@
     "@types/sanitize-html": "^2.8.0",
     "@types/uuid": "^9.0.0",
     "eslint": "8.7.0",
-    "eslint-config-next": "12.0.8",
+    "eslint-config-next": "^13.4.19",
     "eslint-plugin-storybook": "^0.6.11",
     "eslint-plugin-valtio": "^0.4.1",
     "sass-loader": "^13.2.2",

pages/_app.tsx

@@ -1,6 +1,8 @@
 import { appWithTranslation } from 'next-i18next'
 import Head from 'next/head'
 import Link from 'next/link'
+import localFont from '@next/font/local'
+import { useIsomorphicLayoutEffect } from 'react-use'
 import { useTranslation } from 'next-i18next'
 import { get } from 'local-storage'
 import { getCookie, setCookie } from 'cookies-next'
@@ -22,6 +24,12 @@ import type { AppProps } from 'next/app'
 
 import DiscordIcon from '~public/icons/discord.svg'
 import ShareIcon from '~public/icons/Share.svg'
+
+const goalking = localFont({
+  src: './fonts/gk-variable.woff2',
+  fallback: ['system-ui', 'inter', 'helvetica neue', 'sans-serif'],
+  variable: '--font-goalking',
+})
 import '../styles/globals.scss'
 
 function MyApp({ Component, pageProps }: AppProps) {
@@ -29,6 +37,10 @@ function MyApp({ Component, pageProps }: AppProps) {
   const [mounted, setMounted] = useState(false)
   const [refresh, setRefresh] = useState(false)
 
+  useIsomorphicLayoutEffect(() => {
+    document.body.style.setProperty('--font-family', goalking.style.fontFamily)
+  }, [])
+
   // Subscribe to app state to listen for account changes and
   // unsubscribe when component is unmounted
   const unsubscribe = subscribe(accountState, () => {
@@ -111,7 +123,7 @@ function MyApp({ Component, pageProps }: AppProps) {
           <div className="Connect">
             <p>{t('errors.server_unavailable.discord')}</p>
             <div className="Discord LinkItem">
-              <Link href="https://discord.gg/qyZ5hGdPC8">
+              <Link legacyBehavior href="https://discord.gg/qyZ5hGdPC8">
                 <a
                   href="https://discord.gg/qyZ5hGdPC8"
                   target="_blank"

public/locales/en/updates.json

@@ -19,6 +19,9 @@
     "uncap": "Uncap"
   },
   "versions": {
+    "2023-08F": {
+      "features": ["Added new class \"Street King\""]
+    },
     "2023-05L": {
       "features": ["A large update is in the works. Stay tuned!"]
     },

public/locales/ja/updates.json

@@ -19,6 +19,9 @@
     "uncap": "上限解放"
   },
   "versions": {
+    "2023-08F": {
+      "features": "新ジョブ「キング」を追加"
+    },
     "2023-05L": {
       "features": ["特大アップデートが開発中。お楽しみにしてください！"]
     },

styles/globals.scss

@@ -10,8 +10,7 @@ html {
 body {
   -webkit-font-smoothing: antialiased;
   box-sizing: border-box;
-  font-family: system-ui, -apple-system, 'Helvetica Neue', Helvetica, Arial,
-    sans-serif;
+  font-family: var(--font-family);
   font-size: 1.4rem;
   height: 100%;
   padding: $unit-2x !important;
@@ -26,6 +25,7 @@ body {
 }
 
 main {
+  font-family: var(--font-goalking);
   min-height: 90%;
 }
 
@@ -66,8 +66,7 @@ button,
 input,
 textarea {
   border: 2px solid transparent;
-  font-family: system-ui, -apple-system, 'Helvetica Neue', Helvetica, Arial,
-    sans-serif;
+  font-family: var(--font-family);
   font-size: $font-regular;
 }