move yaml data into workspace package

.eslintrc.json

@@ -15,7 +15,7 @@
     "prettier"
   ],
   "parser": "@typescript-eslint/parser",
-  "ignorePatterns": ["/plugins/*", "src/assets/typevalidation/output", "wasm_module/"],
+  "ignorePatterns": ["/plugins/*", "packages/data/typevalidation/output", "wasm_module/"],
   "settings": {
     "import/parsers": {
       "@typescript-eslint/parser": [".ts", ".tsx"]

.gitignore

@@ -149,4 +149,4 @@ install.bat
 .mf/
 
 wasm_module/target/
-/src/assets/typevalidation/output
+/packages/data/typevalidation/output

package.json

@@ -33,8 +33,8 @@
     "checkStaged": "concurrently -g -c auto pnpm:testData pnpm:validateDataTypes pnpm:lint-staged",
     "checkAll": "concurrently -g -c auto pnpm:testData pnpm:validateDataTypes pnpm:eslint pnpm:prettierCheck pnpm:typeCheck",
     "updateMappings": "node updateMappings.js",
-    "testData": "tsx ./src/assets/testData.js",
-    "validateDataTypes": "typia generate --input ./src/assets/typevalidation/ --output ./src/assets/typevalidation/output && tsx ./src/assets/typevalidation/output",
+    "testData": "tsx ./packages/data/testData.js",
+    "validateDataTypes": "typia generate --input ./packages/data/typevalidation/ --output ./packages/data/typevalidation/output && tsx ./packages/data/typevalidation/output",
     "extractLocale": "babel --config-file ./babel-extract.config.js 'src/**/*.{js,jsx,ts,tsx}' > /dev/null",
     "extractLocaleEn": "babel --config-file ./babel-extract-en.config.js 'src/**/*.{js,jsx,ts,tsx}' > /dev/null && node cleanupLocale.js",
     "extractLocaleCMD": "babel --config-file ./babel-extract.config.js \"src/**/*.{js,jsx,ts,tsx}\" > NUL",
@@ -60,6 +60,7 @@
     "@reduxjs/toolkit": "^2.5.0",
     "axios": "^1.7.9",
     "comlink": "^4.4.2",
+    "data": "workspace:./packages/data",
     "i18next": "^24.2.0",
     "js-yaml": "^4.1.0",
     "json-url": "^3.1.0",

src/assets/modifierdata/index.ts → packages/data/modifierdata/index.ts

@@ -1,19 +1,25 @@
-import buffs from './buffs.yaml';
-import Elementalist from './elementalist.yaml';
-import Engineer from './engineer.yaml';
-import food from './food.yaml';
-import Guardian from './guardian.yaml';
-import Mesmer from './mesmer.yaml';
+import yaml from 'js-yaml';
 import type { ModifierData, Section } from './metadata';
-import Necromancer from './necromancer.yaml';
-import Ranger from './ranger.yaml';
-import relics from './relics.yaml';
-import Revenant from './revenant.yaml';
-import runes from './runes.yaml';
-import sigils from './sigils.yaml';
-import Thief from './thief.yaml';
-import utility from './utility.yaml';
-import Warrior from './warrior.yaml';
+
+export * from './metadata';
+
+const load = (path: string) => yaml.load(path) as ModifierData;
+
+const buffs = load('./buffs.yaml');
+const Elementalist = load('./elementalist.yaml');
+const Engineer = load('./engineer.yaml');
+const food = load('./food.yaml');
+const Guardian = load('./guardian.yaml');
+const Mesmer = load('./mesmer.yaml');
+const Necromancer = load('./necromancer.yaml');
+const Ranger = load('./ranger.yaml');
+const relics = load('./relics.yaml');
+const Revenant = load('./revenant.yaml');
+const runes = load('./runes.yaml');
+const sigils = load('./sigils.yaml');
+const Thief = load('./thief.yaml');
+const utility = load('./utility.yaml');
+const Warrior = load('./warrior.yaml');
 
 // combines items in all sections into one object
 const byId = (sections: Section[]) => {

packages/data/package.json

@@ -0,0 +1,14 @@
+{
+  "type": "module",
+  "exports": {
+    ".": "./index.ts",
+    "./modifierdata": "./modifierdata/index.ts",
+    "./presetdata": "./presetdata/index.ts"
+  },
+  "dependencies": {
+    "js-yaml": "^4.1.0"
+  },
+  "devDependencies": {
+    "typia": "^7.5.1"
+  }
+}

packages/data/presetdata/index.ts

@@ -0,0 +1,55 @@
+import yaml from 'js-yaml';
+import type {
+  CreditData,
+  PresetAffixes,
+  PresetBuffs,
+  PresetDistribution,
+  PresetExtras,
+  PresetInfusions,
+  PresetTraits,
+  Templates,
+} from './metadata';
+
+export * from './metadata';
+
+const creditData = yaml.load('./presetdata/credit.yaml') as CreditData;
+const presetAffixes = yaml.load('./presetdata/preset-affixes.yaml') as PresetAffixes;
+const presetBuffs = yaml.load('./presetdata/preset-buffs.yaml') as PresetBuffs;
+const presetDistribution = yaml.load('./presetdata/preset-distribution.yaml') as PresetDistribution;
+const presetExtras = yaml.load('./presetdata/preset-extras.yaml') as PresetExtras;
+const presetInfusions = yaml.load('./presetdata/preset-infusions.yaml') as PresetInfusions;
+const presetTraits = yaml.load('./presetdata/preset-traits.yaml') as PresetTraits;
+const templates = yaml.load('./presetdata/templates.yaml') as Templates;
+
+export interface PresetData {
+  templates: Templates;
+  presetBuffs: PresetBuffs;
+  presetAffixes: PresetAffixes;
+  presetDistribution: PresetDistribution;
+  presetExtras: PresetExtras;
+  presetInfusions: PresetInfusions;
+  presetTraits: PresetTraits;
+  creditData: CreditData;
+}
+
+export {
+  templates,
+  presetBuffs,
+  presetAffixes,
+  presetDistribution,
+  presetExtras,
+  presetInfusions,
+  presetTraits,
+  creditData,
+};
+
+export default {
+  templates,
+  presetBuffs,
+  presetAffixes,
+  presetDistribution,
+  presetExtras,
+  presetInfusions,
+  presetTraits,
+  creditData,
+};

src/assets/presetdata/metadata.ts → packages/data/presetdata/metadata.ts

@@ -1,15 +1,15 @@
-import type { BuffsSlice } from '../../state/slices/buffs';
-import type { Distribution } from '../../state/slices/distribution';
-import type { ExtrasSlice } from '../../state/slices/extras';
-import type { PrioritiesSlice } from '../../state/slices/priorities';
-import type { SkillsSlice } from '../../state/slices/skills';
-import type { TraitsSlice } from '../../state/slices/traits';
+import type { BuffsSlice } from '../../../src/state/slices/buffs';
+import type { Distribution } from '../../../src/state/slices/distribution';
+import type { ExtrasSlice } from '../../../src/state/slices/extras';
+import type { PrioritiesSlice } from '../../../src/state/slices/priorities';
+import type { SkillsSlice } from '../../../src/state/slices/skills';
+import type { TraitsSlice } from '../../../src/state/slices/traits';
 import type {
   InfusionName,
   ProfessionName,
   ProfessionOrSpecializationName,
   WeaponHandednessType,
-} from '../../utils/gw2-data';
+} from '../../../src/utils/gw2-data';
 
 interface TemplateEntryBase {
   name: string;

src/assets/presetdata/templateTransform.ts → packages/data/presetdata/templateTransform.ts

@@ -1,5 +1,5 @@
-import type { PresetData } from '../../utils/data';
-import type { ProfessionName } from '../../utils/gw2-data';
+import type { PresetData } from 'data/presetdata';
+import type { ProfessionName } from '../../../src/utils/gw2-data';
 import type { TemplateEntry } from './metadata';
 
 const defaultBoonTemplates = {

src/assets/testData.js → packages/data/testData.js

@@ -14,7 +14,7 @@ import {
   relicsDict,
   runesDict,
   sigilDict,
-} from '../components/url-state/schema/SchemaDicts';
+} from '../../src/components/url-state/schema/SchemaDicts';
 
 // import specializationData from '../utils/mapping/specializations.json' assert { type: 'json' };
 import {
@@ -55,7 +55,7 @@ const schemaKeys = {
   'buffs.yaml': buffsDict,
 };
 
-const modifierDirectory = './src/assets/modifierdata/';
+const modifierDirectory = './packages/data/modifierdata/';
 
 const allTraitIds = new Set();
 const allExtrasIds = new Set();
@@ -487,7 +487,7 @@ function parseNumber(value, key, id) {
  * test presets
  */
 
-const presetDirectory = './src/assets/presetdata/';
+const presetDirectory = './packages/data/presetdata/';
 
 // const types = {
 //   name

src/assets/typevalidation/index.ts → packages/data/typevalidation/index.ts

@@ -26,8 +26,8 @@ const gentleAssert = (condition: boolean, message: string) => {
   }
 };
 
-const modifierDirectory = './src/assets/modifierdata/';
-const presetDirectory = './src/assets/presetdata/';
+const modifierDirectory = './packages/data/modifierdata/';
+const presetDirectory = './packages/data/presetdata/';
 
 const testModifiers = async () => {
   const files = (await fs.readdir(modifierDirectory)).filter(

pnpm-workspace.yaml

@@ -0,0 +1,2 @@
+packages:
+- 'packages/*'

src/components/BuildPage.tsx

@@ -4,8 +4,8 @@ import { Box, Paper, Typography } from '@mui/material';
 import * as React from 'react';
 import { useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
-import { buffModifiers, classModifiers } from '../assets/modifierdata';
-import type { ModifierItem } from '../assets/modifierdata/metadata';
+import { buffModifiers, classModifiers } from '../../packages/data/modifierdata';
+import type { ModifierItem } from '../../packages/data/modifierdata/metadata';
 import { importStateCharacter } from '../state/async/buildPageThunks';
 import { useAppDispatch } from '../state/redux-hooks';
 import {

src/components/TemplateInfo.tsx

@@ -1,12 +1,12 @@
 import { Profession } from '@discretize/gw2-ui-new';
 import OpenInNewIcon from '@mui/icons-material/OpenInNew';
 import { Link } from '@mui/material';
+import type { Credit, PresetDistributionEntry } from 'data/presetdata';
+import { creditData, presetDistribution } from 'data/presetdata';
 import { Fragment } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
-import type { Credit, PresetDistributionEntry } from '../assets/presetdata/metadata';
 import { getSelectedDistribution } from '../state/slices/distribution';
-import data from '../utils/data';
 import Info from './baseComponents/Info';
 
 const TemplateLabel = ({ preset }: { preset: PresetDistributionEntry }) => {
@@ -23,7 +23,7 @@ const TemplateLabel = ({ preset }: { preset: PresetDistributionEntry }) => {
 };
 
 const Author = ({ name }: { name: string }) => {
-  const url = data.creditData[name]?.authorUrl;
+  const url = creditData[name]?.authorUrl;
   return url ? (
     <Link href={url} target="_blank" rel="noopener">
       {name}
@@ -45,7 +45,7 @@ const EndingLinks = ({ credit }: { credit: Credit[] }) =>
 export default function TemplateInfo() {
   const selectedDistribution = useSelector(getSelectedDistribution);
 
-  const distributionData = data.presetDistribution.list.find(
+  const distributionData = presetDistribution.list.find(
     (entry) => entry.name === selectedDistribution,
   );
   const credit = distributionData?.credit;
@@ -66,7 +66,7 @@ export default function TemplateInfo() {
         </Trans>
       )}
       {credit
-        .filter((entry) => data.creditData[entry.author]?.authorUrl && entry.url)
+        .filter((entry) => creditData[entry.author]?.authorUrl && entry.url)
         .map((entry) => (
           <Fragment key={`${entry.url}`}>
             {' '}

src/components/baseComponents/Presets.tsx

@@ -3,7 +3,7 @@ import { Box, Chip, TextField, Typography } from '@mui/material';
 import Autocomplete from '@mui/material/Autocomplete';
 import { useTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
-import type { PresetEntry } from '../../assets/presetdata/metadata';
+import type { PresetEntry } from 'data/presetdata';
 import { getProfession, getSelectedTemplate } from '../../state/slices/controlsSlice';
 
 // this many chips are allowed before they will be put into a dropdown select

src/components/nav/NavAccordion.tsx

@@ -3,10 +3,10 @@ import { Box, Chip } from '@mui/material';
 import MuiAccordion from '@mui/material/Accordion';
 import MuiAccordionDetails from '@mui/material/AccordionDetails';
 import MuiAccordionSummary from '@mui/material/AccordionSummary';
+import { templates } from 'data/presetdata';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { makeStyles } from 'tss-react/mui';
-import data from '../../utils/data';
 import type { ProfessionName } from '../../utils/gw2-data';
 
 const useStyles = makeStyles()((theme) => ({
@@ -57,7 +57,7 @@ export default function NavAccordion({ handleTemplateSelect }: NavAccordionProps
     setExpanded(newExpanded ? panel : '');
   };
 
-  return data.templates.list.map((prof) => (
+  return templates.list.map((prof) => (
     <MuiAccordion
       classes={{ root: classes.accordionRoot }}
       square

src/components/nav/NavBar.tsx

@@ -12,6 +12,8 @@ import {
   Typography,
   useMediaQuery,
 } from '@mui/material';
+import data, { templates } from 'data/presetdata';
+import { getBuildTemplateData } from 'data/presetdata/templateTransform';
 import Menu from 'material-ui-popup-state/HoverMenu';
 import type { PopupState } from 'material-ui-popup-state/hooks';
 import { bindHover, bindMenu, usePopupState } from 'material-ui-popup-state/hooks';
@@ -22,7 +24,6 @@ import { makeStyles } from 'tss-react/mui';
 import fractalImg from '../../assets/images/icons/fractals.png';
 import raidImg from '../../assets/images/icons/raids.png';
 import wvwImg from '../../assets/images/icons/wvw.png';
-import { getBuildTemplateData } from '../../assets/presetdata/templateTransform';
 import { stopCalc } from '../../state/async/calculationThunks';
 import { useAppDispatch } from '../../state/redux-hooks';
 import {
@@ -33,7 +34,6 @@ import {
   setBuildTemplate,
 } from '../../state/slices/controlsSlice';
 import { changeGameMode, getExpertMode, getGameMode } from '../../state/slices/userSettings';
-import data from '../../utils/data';
 import type { ProfessionName } from '../../utils/gw2-data';
 import { PROFESSIONS } from '../../utils/gw2-data';
 import NavAccordion from './NavAccordion';
@@ -57,7 +57,7 @@ const Navbar = () => {
   const selectedSpecialization = useSelector(getSelectedSpecialization);
   const selectedTemplateName = useSelector(getSelectedTemplate);
 
-  const selectedTemplate = data.templates.list
+  const selectedTemplate = templates.list
     .find((elem) => elem.class === profession)
     ?.builds?.find((elem) => elem.name === selectedTemplateName);
 

src/components/nav/ReapplyTemplateDialog.tsx

@@ -6,16 +6,16 @@ import {
   DialogContentText,
   DialogTitle,
 } from '@mui/material';
+import data from 'data/presetdata';
+import { getBuildTemplateData } from 'data/presetdata/templateTransform';
 import { Trans } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
-import { getBuildTemplateData } from '../../assets/presetdata/templateTransform';
 import {
   getProfession,
   getSelectedTemplate,
   setBuildTemplate,
 } from '../../state/slices/controlsSlice';
 import { getGameMode } from '../../state/slices/userSettings';
-import data from '../../utils/data';
 
 interface ReapplyTemplateDialogProps {
   open: boolean;