Fix go-next typecheck and add build CI

.github/workflows/build-frontend.yml

@@ -48,12 +48,19 @@ jobs:
           printf '%s' "$ENVFILE" > apps/frontend/.env.local
         env:
           ENVFILE: ${{ vars.ENVFILE }}
-      - name: Build genshin-optimizer
+      - name: Build frontend
         run: |
           NX_URL_GITHUB_GO_CURRENT_VERSION="https://github.com/${{ github.repository }}/commit/$(git rev-parse HEAD)" \
           NX_DAEMON="false" \
           NX_SHOW_DEV_COMPONENTS="${{inputs.show_dev_components}}" \
-          yarn run nx run ${{inputs.frontend_name}}:build:production
+      - name: Build gi-frontend
+        if: inputs.frontend_name == 'gi-frontend'
+        run: yarn nx run gi-frontend:next:build
+      - name: Build other frontend
+        if: inputs.frontend_name != 'gi-frontend'
+        run: yarn run nx run ${{inputs.frontend_name}}:build:production
+      - name: echos
+        run: |
           echo ${{inputs.frontend_name}} > frontend_name
           echo ${{inputs.deployment_name}} > deployment_name
           echo $(git rev-parse HEAD) > ref

.github/workflows/build-go-next-pr.yml

@@ -0,0 +1,28 @@
+name: Build GO-next PR
+run-name: Build GO-next for ${{ github.event.number }} - ${{ github.event.pull_request.title }}
+
+permissions:
+  contents: read
+
+on:
+  pull_request:
+    paths-ignore:
+      - 'apps/gi-backend/**'
+      - 'apps/gi-backend-e2e/**'
+      - 'apps/gi-frontend-next-e2e/**'
+      - 'apps/gi-frontend-next-e2e/**'
+      - 'apps/sr-frontend/**'
+      - 'apps/sr-frontend-e2e/**'
+      - 'libs/gi/frontend-gql/**'
+      - 'libs/gi/prisma-schema/**'
+      - 'libs/gi/ui-next/**'
+      - 'libs/sr/**'
+    types: [opened, reopened, synchronize, labeled]
+
+jobs:
+  call-build-gi-frontend:
+    uses: ./.github/workflows/build-frontend.yml
+    with:
+      frontend_name: 'gi-frontend'
+      deployment_name: ${{ github.event.number }}
+      show_dev_components: ${{ contains(github.event.pull_request.labels.*.name, 'showDevComponents') }}

.github/workflows/build-go-wr-pr.yml

@@ -7,6 +7,7 @@ permissions:
 on:
   pull_request:
     paths-ignore:
+      - 'apps/gi-frontend/**'
       - 'apps/gi-backend/**'
       - 'apps/gi-backend-e2e/**'
       - 'apps/gi-frontend-next-e2e/**'

apps/gi-frontend/tsconfig.json

@@ -11,12 +11,15 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "incremental": true,
+    "noPropertyAccessFromIndexSignature": false,
+    "exactOptionalPropertyTypes": false,
+    "noImplicitAny": false,
     "plugins": [
       {
         "name": "next"
       }
     ],
-    "types": ["jest", "node"]
+    "types": ["jest", "node", "object-overrides"]
   },
   "include": [
     "**/*.ts",

libs/common/ui/src/components/ShowingAndSortOptionSelect.tsx

@@ -37,7 +37,7 @@ export function ShowingAndSortOptionSelect({
         <SortByButton
           sortKeys={sortByButtonProps.sortKeys}
           value={sortByButtonProps.value}
-          onChange={(value) => sortByButtonProps.onChange(value)}
+          onChange={(value) => sortByButtonProps.onChange(value as string)}
           ascending={sortByButtonProps.ascending}
           onChangeAsc={sortByButtonProps.onChangeAsc}
         />

libs/common/util/src/lib/array.ts

@@ -58,7 +58,7 @@ export function linspace(
 }
 
 /** Intended to use with array.filter function to type check against Array<TValue|undefined> -> Array<TValue> */
-export function notEmpty<T>(value: T | null | undefined): value is T {
+export function notEmpty<T>(value: T | null | undefined | ''): value is T {
   return value !== null && value !== undefined
 }
 

libs/gi/assets/src/index.ts

@@ -6,10 +6,10 @@ import type {
   WeaponKey,
 } from '@genshin-optimizer/gi/consts'
 import { charKeyToLocGenderedCharKey } from '@genshin-optimizer/gi/consts'
+import type { StaticImageData } from 'next/image'
 import artifacts from './gen/artifacts'
 import chars from './gen/chars'
 import weapons from './gen/weapons'
-
 export * from './assets'
 
 type characterAssetKey =
@@ -34,33 +34,30 @@ export function characterAsset(
   ck: CharacterKey,
   asset: characterAssetKey,
   gender: GenderKey = 'F'
-): string {
+) {
   switch (asset) {
     case 'icon':
     case 'iconSide':
-      return chars[charKeyToLocGenderedCharKey(ck, gender)][asset] ?? '' //gender specific
+      return chars[charKeyToLocGenderedCharKey(ck, gender)][asset] //gender specific
     default:
-      return (chars[ck] as Record<characterAssetKey, string>)[asset] ?? ''
+      return (chars[ck] as Record<characterAssetKey, string | StaticImageData>)[
+        asset
+      ]
   }
 }
-export function artifactAsset(
-  ak: ArtifactSetKey,
-  slotKey: ArtifactSlotKey
-): string {
+export function artifactAsset(ak: ArtifactSetKey, slotKey: ArtifactSlotKey) {
   if (
     ak === 'PrayersForDestiny' ||
     ak === 'PrayersForIllumination' ||
     ak === 'PrayersForWisdom' ||
     ak === 'PrayersToSpringtime'
   )
     return artifacts[ak].circlet
-  else return artifacts[ak][slotKey] ?? ''
+  else return artifacts[ak][slotKey]
 }
 export function artifactDefIcon(setKey: ArtifactSetKey) {
   return artifactAsset(setKey, 'flower') || artifactAsset(setKey, 'circlet')
 }
 export function weaponAsset(wk: WeaponKey, empowered = true) {
-  return (
-    weapons[wk][empowered ? 'awakenIcon' : 'icon'] ?? weapons[wk]['icon'] ?? ''
-  )
+  return weapons[wk][empowered ? 'awakenIcon' : 'icon'] ?? weapons[wk]['icon']
 }

libs/gi/char-cards/src/index.ts

@@ -175,15 +175,15 @@ const charCards = {
   Zhongli,
 } as const
 
-export function charCard(charKey: CharacterKey, gender: GenderKey): string {
+export function charCard(charKey: CharacterKey, gender: GenderKey) {
   switch (charKey) {
     case 'TravelerAnemo':
     case 'TravelerDendro':
     case 'TravelerElectro':
     case 'TravelerGeo':
     case 'TravelerHydro':
-      return charCards[`Traveler${gender}`] ?? ''
+      return charCards[`Traveler${gender}`]
     default:
-      return charCards[charKey] ?? ''
+      return charCards[charKey]
   }
 }

libs/gi/page-archive/src/CharacterView.tsx

@@ -1,4 +1,8 @@
-import { CardThemed, ModalWrapper } from '@genshin-optimizer/common/ui'
+import {
+  CardThemed,
+  ModalWrapper,
+  NextImage,
+} from '@genshin-optimizer/common/ui'
 import { range } from '@genshin-optimizer/common/util'
 import type { CharacterKey } from '@genshin-optimizer/gi/consts'
 import { maxConstellationCount } from '@genshin-optimizer/gi/consts'
@@ -210,7 +214,7 @@ function SkillDisplayCard({
         <Grid container sx={{ flexWrap: 'nowrap' }}>
           <Grid item>
             <Box
-              component="img"
+              component={NextImage ? NextImage : 'img'}
               src={talentSheet?.img}
               sx={{ width: 60, height: 'auto' }}
             />

libs/gi/page-team/src/CharProfileCard.tsx

@@ -1,5 +1,5 @@
 import { useBoolState } from '@genshin-optimizer/common/react-util'
-import { CardThemed } from '@genshin-optimizer/common/ui'
+import { CardThemed, NextImage } from '@genshin-optimizer/common/ui'
 import { range } from '@genshin-optimizer/common/util'
 import { CharacterContext, useDBMeta } from '@genshin-optimizer/gi/db-ui'
 import type { TalentSheetElementKey } from '@genshin-optimizer/gi/sheets'
@@ -68,7 +68,7 @@ export function CharacterCompactConstellation() {
       {range(1, 6).map((i) => (
         <Grid item xs={4} key={i}>
           <Box
-            component="img"
+            component={NextImage ? NextImage : 'img'}
             src={
               characterSheet.getTalentOfKey(
                 `constellation${i}` as TalentSheetElementKey

libs/gi/page-team/src/CharacterDisplay/Tabs/TabOptimize/Components/ArtifactSetConfig.tsx

@@ -5,6 +5,7 @@ import {
   ColorText,
   InfoTooltipInline,
   ModalWrapper,
+  NextImage,
   SqBadge,
 } from '@genshin-optimizer/common/ui'
 import {
@@ -590,7 +591,7 @@ function ArtifactSetCard({
           sx={{ display: 'flex' }}
         >
           <Box
-            component="img"
+            component={NextImage ? NextImage : 'img'}
             src={artifactDefIcon(setKey)}
             sx={{ height: 100, width: 'auto', mx: -1 }}
           />

libs/gi/page-team/src/CharacterDisplay/Tabs/TabTalent.tsx

@@ -2,6 +2,7 @@ import {
   CardThemed,
   ConditionalWrapper,
   DropdownButton,
+  NextImage,
 } from '@genshin-optimizer/common/ui'
 import { range } from '@genshin-optimizer/common/util'
 import { maxConstellationCount } from '@genshin-optimizer/gi/consts'
@@ -298,7 +299,7 @@ function SkillDisplayCard({
           <Grid container sx={{ flexWrap: 'nowrap' }}>
             <Grid item>
               <Box
-                component="img"
+                component={NextImage ? NextImage : 'img'}
                 src={talentSheet?.img}
                 sx={{ width: 60, height: 'auto' }}
               />

libs/gi/sheets/src/Characters/ICharacterSheet.d.ts

@@ -1,8 +1,8 @@
+import type { StaticImageData } from 'next/image'
 import type { DocumentSection } from '../sheet'
-
 export interface TalentSheetElement {
   name: ReactNode //talentName
-  img: string
+  img: string | StaticImageData
   sections: DocumentSection[]
 }
 export type TalentSheetElementKey =

libs/gi/sheets/src/Characters/charTemplates.tsx

@@ -9,6 +9,7 @@ import {
 import { getCharStat } from '@genshin-optimizer/gi/stats'
 import type { NumNode } from '@genshin-optimizer/gi/wr'
 import { greaterEq, input } from '@genshin-optimizer/gi/wr'
+import type { StaticImageData } from 'next/image'
 import type { ReactNode } from 'react'
 import { st, trans } from '../SheetUtil'
 import type {
@@ -59,7 +60,7 @@ export const charTemplates = (cKey: CharacterSheetKey): ICharacterTemplate => {
   const characterKey = charSheetKeyToCharKey(cKey)
   const wKey = getCharStat(characterKey).weaponType
 
-  const img = (tk: TalentSheetElementKey): string => {
+  const img = (tk: TalentSheetElementKey) => {
     if (tk === 'auto') return imgAssets.weaponTypes[wKey]
     return characterAsset(characterKey, tk, 'F') // Should be all genderless assets
   }
@@ -89,7 +90,7 @@ export const charTemplates = (cKey: CharacterSheetKey): ICharacterTemplate => {
 const talentTemplate = (
   talentKey: TalentSheetElementKey,
   tr: (i18key: string) => ReactNode,
-  img: string,
+  img: string | StaticImageData,
   docSections?: DocumentSection[]
 ): TalentSheetElement => ({
   name: tr(`${talentKey}.name`),
@@ -103,7 +104,7 @@ const talentTemplate = (
 const talentHeader = (
   talentKey: TalentSheetElementKey,
   tr: (i18key: string) => ReactNode,
-  img: string
+  img: string | StaticImageData
 ): IDocumentHeader => {
   return {
     title: tr(`${talentKey}.name`),
@@ -125,7 +126,7 @@ function charSheetKeyToCharKey(csk: CharacterSheetKey): CharacterKey {
 const headerTemplate = (
   talentKey: TalentSheetElementKey,
   tr: (i18key: string) => ReactNode,
-  img: string,
+  img: string | StaticImageData,
   partialSection: DocumentSection
 ): DocumentSection => ({
   ...partialSection,
@@ -145,7 +146,7 @@ const conditionalTemplate = (
   talentKey: TalentSheetElementKey,
   partialCond: DocumentConditionalBase,
   tr: (i18key: string) => ReactNode,
-  img: string
+  img: string | StaticImageData
 ): DocumentConditional => ({
   ...partialCond,
   header: { ...talentHeader(talentKey, tr, img), ...partialCond.header },

libs/gi/silly-wisher/src/portraits/index.ts

@@ -167,9 +167,6 @@ const data = {
   Zhongli,
 } as const
 
-export function portrait(charKey: CharacterKey, gender: GenderKey): string {
-  return (
-    data[charKeyToLocGenderedCharKey(charKey, gender) as keyof typeof data] ??
-    ''
-  )
+export function portrait(charKey: CharacterKey, gender: GenderKey) {
+  return data[charKeyToLocGenderedCharKey(charKey, gender) as keyof typeof data]
 }

libs/gi/silly-wisher/src/splash/index.ts

@@ -166,10 +166,8 @@ const charCards = {
   Zhongli,
 } as const
 
-export function splash(charKey: CharacterKey, gender: GenderKey): string {
-  return (
-    charCards[
-      charKeyToLocGenderedCharKey(charKey, gender) as keyof typeof charCards
-    ] ?? ''
-  )
+export function splash(charKey: CharacterKey, gender: GenderKey) {
+  return charCards[
+    charKeyToLocGenderedCharKey(charKey, gender) as keyof typeof charCards
+  ]
 }

libs/gi/ui/src/components/ad/GoAd/DrakeAd.tsx

@@ -1,3 +1,4 @@
+import { NextImage } from '@genshin-optimizer/common/ui'
 import { Box } from '@mui/system'
 import type { ReactNode } from 'react'
 import { toMainSite } from '../util'
@@ -20,7 +21,7 @@ export function DrakeAd({ children }: { children: ReactNode }) {
     >
       {children}
       <Box
-        component="img"
+        component={NextImage ? NextImage : 'img'}
         src={drake}
         maxWidth="100%"
         maxHeight="100%"

libs/gi/ui/src/components/ad/GoAd/GOAd.tsx

@@ -1,4 +1,4 @@
-import { useRefSize } from '@genshin-optimizer/common/ui'
+import { NextImage, useRefSize } from '@genshin-optimizer/common/ui'
 import { Typography } from '@mui/material'
 import { Box } from '@mui/system'
 import type { ReactNode } from 'react'
@@ -27,7 +27,12 @@ export function GOAd({ children }: { children: ReactNode }) {
       onClick={toMainSite}
     >
       {children}
-      <Box component="img" src={go} height={100} maxHeight={'100%'} />
+      <Box
+        component={NextImage ? NextImage : 'img'}
+        src={go}
+        height={100}
+        maxHeight={'100%'}
+      />
       <Typography>
         The Ultimate Genshin Impact calculator, that allows you to min-max your
         characters according to how you play, using what you have.

libs/gi/ui/src/components/ad/GoAd/SRODevAd.tsx

@@ -1,3 +1,4 @@
+import { NextImage } from '@genshin-optimizer/common/ui'
 import { Typography } from '@mui/material'
 import { Box } from '@mui/system'
 import type { ReactNode } from 'react'
@@ -24,7 +25,7 @@ export function SRODevAd({ children }: { children: ReactNode }) {
       <Typography variant="h5" color="crimson">
         DO YOU WANT A STAR RAIL OPTIMIZER?
       </Typography>
-      <Box component="img" src={sro} maxWidth={100} />
+      <Box component={NextImage ? NextImage : 'img'} src={sro} maxWidth={100} />
 
       <Typography>
         Exciting News! We're currently developing the Star Rail Optimizer, and