multiweaponselector with fancy

2026-09-30 07:12:36 -05:00 · 2020-12-17 15:44:10 +02:00
parent 07197e662e
commit 05a0e6e2f2
17 changed files with 74 additions and 74 deletions
--- a/components/common/MultiWeaponSelector.tsx
+++ b/components/common/MultiWeaponSelector.tsx
@@ -1,8 +1,7 @@
-import { Select, Tag, TagCloseButton, TagLabel } from "@chakra-ui/react";
-import { t } from "@lingui/macro";
+import { Tag, TagCloseButton, TagLabel } from "@chakra-ui/react";
 import { useLingui } from "@lingui/react";
-import { salmonRunWeapons, weaponsWithHero } from "lib/lists/weaponsWithHero";
 import WeaponImage from "./WeaponImage";
+import WeaponSelector from "./WeaponSelector";

 interface Props {
  name?: string;
@@ -12,19 +11,15 @@ interface Props {
 }

 const MultiWeaponSelector: React.FC<Props> = ({
-  name,
  value,
  onChange,
  isSalmonRun,
 }) => {
  const { i18n } = useLingui();

-  const weaponsArray: readonly string[] = isSalmonRun
-    ? salmonRunWeapons
-    : weaponsWithHero;
  return (
    <>
-      <Select
+      {/* <Select
        name={name}
        onChange={(e) => {
          if (!!e.target.value && !value.includes(e.target.value))
@@ -47,7 +42,19 @@ const MultiWeaponSelector: React.FC<Props> = ({
            {i18n._(wpn)}
          </option>
        ))}
-      </Select>
+      </Select> */}
+      <WeaponSelector
+        value={undefined}
+        setValue={(selectedWeapon) => {
+          if (!!selectedWeapon && !value.includes(selectedWeapon))
+            onChange(value.concat(selectedWeapon));
+        }}
+        pool={isSalmonRun ? "SALMON_RUN" : "WITH_ALTS"}
+        isDisabled={
+          (isSalmonRun && value.length === 4) ||
+          (!isSalmonRun && value.length === 5)
+        }
+      />
      {value.map((wpn) => (
        <Tag
          size="small"
--- a/components/common/MySelect.tsx
+++ b/components/common/MySelect.tsx
@@ -79,8 +79,6 @@ const MySelect: React.FC<SelectProps> = ({
    return undefined;
  };

-  console.log({ borderColor });
-
  return (
    <ReactSelect
      className="basic-single"
--- a/components/common/WeaponSelector.tsx
+++ b/components/common/WeaponSelector.tsx
@@ -1,6 +1,9 @@
 import { Box, Flex } from "@chakra-ui/react";
 import { useLingui } from "@lingui/react";
-import { weaponsWithHeroCategorized } from "lib/lists/weaponsWithHero";
+import {
+  salmonRunWeapons,
+  weaponsWithHeroCategorized,
+} from "lib/lists/weaponsWithHero";
 import { components } from "react-select";
 import MySelect from "./MySelect";
 import WeaponImage from "./WeaponImage";
@@ -12,7 +15,8 @@ interface WeaponSelectorProps {
  isClearable?: boolean;
  isMulti?: boolean;
  menuIsOpen?: boolean;
-  showAlts?: boolean;
+  isDisabled?: boolean;
+  pool?: "WITH_ALTS" | "SALMON_RUN";
 }

 const WeaponSelector: React.FC<WeaponSelectorProps> = ({
@@ -22,7 +26,8 @@ const WeaponSelector: React.FC<WeaponSelectorProps> = ({
  autoFocus,
  isMulti,
  menuIsOpen,
-  showAlts,
+  isDisabled,
+  pool,
 }) => {
  const { i18n } = useLingui();
  const singleOption = (props: any) => (
@@ -38,27 +43,13 @@ const WeaponSelector: React.FC<WeaponSelectorProps> = ({

  return (
    <MySelect
-      options={
-        showAlts
-          ? weaponsWithHeroCategorized.map((category) => ({
-              label: i18n._(category.name),
-              options: category.weapons.map((weapon) => ({
-                value: weapon,
-                label: i18n._(weapon),
-              })),
-            }))
-          : weaponsWithHeroCategorized.map((category) => ({
-              label: i18n._(category.name),
-              options: category.weapons
-                .filter(
-                  (wpn) => !wpn.includes("Hero") && !wpn.includes("Octo Shot")
-                )
-                .map((weapon) => ({
-                  value: weapon,
-                  label: i18n._(weapon),
-                })),
-            }))
-      }
+      options={getWeaponArray().map((category) => ({
+        label: i18n._(category.name),
+        options: category.weapons.map((weapon) => ({
+          value: weapon,
+          label: i18n._(weapon),
+        })),
+      }))}
      value={value ? { value, label: i18n._(value) } : undefined}
      setValue={setValue}
      isClearable={isClearable}
@@ -70,8 +61,25 @@ const WeaponSelector: React.FC<WeaponSelectorProps> = ({
        Option: singleOption,
      }}
      autoFocus={autoFocus}
+      isDisabled={isDisabled}
    />
  );
+
+  function getWeaponArray() {
+    if (pool === "WITH_ALTS") return weaponsWithHeroCategorized;
+    if (pool === "SALMON_RUN")
+      return weaponsWithHeroCategorized.map((category) => ({
+        ...category,
+        weapons: category.weapons.filter((wpn) => salmonRunWeapons.has(wpn)),
+      }));
+
+    return weaponsWithHeroCategorized.map((category) => ({
+      ...category,
+      weapons: category.weapons.filter(
+        (wpn) => !wpn.includes("Hero") && !wpn.includes("Octo Shot")
+      ),
+    }));
+  }
 };

 export default WeaponSelector;
--- a/components/sr/RotationSelector.tsx
+++ b/components/sr/RotationSelector.tsx
@@ -82,7 +82,6 @@ const RotationSelector: React.FC<Props> = ({ rotationId, setRotationId }) => {
          <Trans>Weapons</Trans>
        </FormLabel>
        <MultiWeaponSelector
-          name="weapons"
          value={weapons}
          onChange={setWeapons}
          isSalmonRun
--- a/lib/lists/weaponsWithHero.ts
+++ b/lib/lists/weaponsWithHero.ts
@@ -142,7 +142,7 @@ export const weaponsWithHero = [
  "Kensa Undercover Brella",
 ] as const;

-export const salmonRunWeapons = [
+export const salmonRunWeapons = new Set([
  "Sploosh-o-matic",
  "Splattershot Jr.",
  "Splash-o-matic",
@@ -193,7 +193,7 @@ export const salmonRunWeapons = [
  "Splat Brella",
  "Tenta Brella",
  "Undercover Brella",
-] as const;
+]);

 export const weaponsWithHeroCategorized: readonly {
  name: string;
--- a/locale/de/messages.json
+++ b/locale/de/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "Nach Effekten filtern",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "Modus",
  "Month": "Monat",
  "Year": "Jahr",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/el/messages.json
+++ b/locale/el/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "Φιλτράρισμα ανά Ικανότητα",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "Mode",
  "Month": "Μήνας",
  "Year": "Έτος",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/en/messages.json
+++ b/locale/en/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "Filter by ability",
  "Home": "Home",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "Markdown is supported - <0>https://sendou.ink/markdown</0>",
-  "Select weapon": "Select weapon",
-  "Random": "Random",
-  "Random (Grizzco)": "Random (Grizzco)",
  "Top 500": "Top 500",
  "Browser": "Browser",
  "Tier Lists": "Tier Lists",
@@ -66,6 +63,8 @@
  "Mode": "Mode",
  "Month": "Month",
  "Year": "Year",
+  "Random": "Random",
+  "Random (Grizzco)": "Random (Grizzco)",
  "Selected rotation": "Selected rotation",
  "Change selection": "Change selection",
  "Stage": "Stage",
--- a/locale/es/messages.json
+++ b/locale/es/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "Filtrar por potenciador",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "Modo",
  "Month": "Mes",
  "Year": "Año",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/fr/messages.json
+++ b/locale/fr/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "Filtrer par aptitudes",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "Mode",
  "Month": "Mois",
  "Year": "Année",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/it/messages.json
+++ b/locale/it/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "Filtra tramite abilità",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "Modalità",
  "Month": "Mese",
  "Year": "Anno",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/ja/messages.json
+++ b/locale/ja/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "",
  "Month": "",
  "Year": "",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/ko/messages.json
+++ b/locale/ko/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "능력별로 거르기",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "모드",
  "Month": "달",
  "Year": "년",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/nl/messages.json
+++ b/locale/nl/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "",
  "Month": "",
  "Year": "",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/pt/messages.json
+++ b/locale/pt/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "Filtrar por habilidade",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "Modo",
  "Month": "Mês",
  "Year": "Ano",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/ru/messages.json
+++ b/locale/ru/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "",
  "Home": "",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "",
-  "Select weapon": "",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "",
  "Browser": "",
  "Tier Lists": "",
@@ -66,6 +63,8 @@
  "Mode": "",
  "Month": "",
  "Year": "",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",
--- a/locale/sv/messages.json
+++ b/locale/sv/messages.json
@@ -19,9 +19,6 @@
  "Filter by ability": "Filtrera efter effekt",
  "Home": "Hem",
  "Markdown is supported - <0>https://sendou.ink/markdown</0>": "Markdown stöds - <0>https://sendou.ink/markdown</0>",
-  "Select weapon": "Välj vapen",
-  "Random": "",
-  "Random (Grizzco)": "",
  "Top 500": "Topp 5000",
  "Browser": "Vy",
  "Tier Lists": "Trender",
@@ -66,6 +63,8 @@
  "Mode": "Spelläge",
  "Month": "Månad",
  "Year": "År",
+  "Random": "",
+  "Random (Grizzco)": "",
  "Selected rotation": "",
  "Change selection": "",
  "Stage": "",