From e956f81f4dfe21a50c966411f3d6d61af993cdb5 Mon Sep 17 00:00:00 2001 From: Nathaniel Moschkin Date: Sat, 9 May 2026 16:01:50 -0400 Subject: [PATCH 001/116] Refactor to React Router DOM --- .env.defaults | 4 +- .github/workflows/beta_deploy.yml | 4 +- .github/workflows/deploy_test.yml_disabled | 4 +- .github/workflows/dev_deploy.yml | 4 +- .github/workflows/pr_build.yml | 4 +- .github/workflows/prod_deploy.yml | 4 +- CONTRIBUTING.md | 10 +- package.json | 188 +- package_old.json | 101 + setupTests.ts | 5 + src/App.css | 38 + src/App.test.tsx | 9 + src/components/alerts/alertmodal.tsx | 8 +- src/components/alerts/alertprovider.tsx | 13 +- src/components/alerts/model.ts | 2 +- src/components/badge.tsx | 12 +- src/components/base/crewdropdown.tsx | 4 +- src/components/base/crewmultiselect.tsx | 14 +- src/components/base/crewtiles.tsx | 4 +- src/components/base/jsoninputform.tsx | 10 +- src/components/base/multiworkerbase.tsx | 2 +- src/components/base/optionsmodal_base.tsx | 4 +- src/components/base/settingsmodal.tsx | 10 +- src/components/base/slider.tsx | 2 - src/components/behold/classicview.tsx | 6 +- src/components/behold/optionsmodal.tsx | 6 +- src/components/behold/standardview.tsx | 2 +- src/components/behold/tableview.tsx | 25 +- .../collections/cards/collectioncard.tsx | 14 +- src/components/collections/cards/crewcard.tsx | 9 +- .../collections/collectiondropdown.tsx | 2 +- .../collections/collectionplanner.tsx | 2 +- .../collections/collectionprefs.tsx | 16 +- .../collections/collectionsviews.tsx | 9 +- src/components/collections/context.tsx | 4 +- src/components/collections/overview_modal.tsx | 12 +- .../overview_panes/collectioncrew.tsx | 11 +- .../overview_panes/collectionmilestones.tsx | 9 +- src/components/collections/rewardfilter.tsx | 2 +- .../collections/views/combosview.tsx | 14 +- src/components/collections/views/overview.tsx | 15 +- .../collections/views/progresstable.tsx | 4 +- .../collections/views/researchview.tsx | 13 +- .../collections/views/tableview.tsx | 31 +- src/components/crewpage/crewfullequiptree.tsx | 11 +- src/components/crewpage/crewquipment.tsx | 11 +- src/components/crewpage/crewvariants.tsx | 11 +- src/components/crewpage/equipmentbuilds.tsx | 20 +- src/components/crewpage/polestars.tsx | 10 +- src/components/crewpicker.tsx | 12 +- src/components/crewretrieval.tsx | 52 +- src/components/crewtables/commonoptions.tsx | 4 +- src/components/crewtables/crewconfigtable.tsx | 26 +- src/components/crewtables/customviews.tsx | 26 +- .../crewtables/filters/cheapestfffe.tsx | 5 +- .../crewtables/filters/crewmaintenance.tsx | 10 +- .../crewtables/filters/crewobtained.tsx | 5 +- .../crewtables/filters/crewofferfilter.tsx | 5 +- .../crewtables/filters/quipmenttools.tsx | 2 +- src/components/crewtables/layers.tsx | 22 +- src/components/crewtables/rewards.tsx | 4 +- src/components/crewtables/rosterpicker.tsx | 26 +- src/components/crewtables/rostersummary.tsx | 8 +- src/components/crewtables/rostertable.tsx | 24 +- src/components/crewtables/shipoptions.tsx | 10 +- src/components/crewtables/views/base.tsx | 6 +- .../crewtables/views/crewutility.tsx | 38 +- .../crewtables/views/quipmentscores.tsx | 2 +- .../crewtables/views/shipabilities.tsx | 8 +- .../crewtables/views/topquipment.tsx | 2 +- src/components/crewtables/weightinginfo.tsx | 13 +- .../dataset_presenters/datagrid.tsx | 2 +- .../dataset_presenters/datamatrix.tsx | 4 +- .../dataset_presenters/datapicker.tsx | 16 +- .../dataset_presenters/elements/crewlabel.tsx | 2 +- .../elements/crewportrait.tsx | 2 +- .../elements/numericdiff.tsx | 2 +- src/components/dataset_presenters/model.ts | 10 +- .../options/skilltoggler.tsx | 2 +- src/components/errorboundary.tsx | 2 +- src/components/event_info_modal.tsx | 2 +- .../event_info_tabs/event_information.tsx | 2 +- .../event_info_tabs/leaderboard.tsx | 4 +- .../eventplanner/eventcrewtable.tsx | 61 +- src/components/eventplanner/eventpicker.tsx | 13 +- src/components/excluder/crewexcluder.tsx | 10 +- src/components/excluder/noteeditor.tsx | 2 +- .../explanations/mapexplanation.tsx | 4 +- .../explanations/powerexplanation.tsx | 18 +- src/components/factions.tsx | 2 +- src/components/fleet/colorname.tsx | 2 +- src/components/fleet/fleet_info.tsx | 6 +- src/components/fleet/fleetimporter.tsx | 2 +- .../fleetbossbattles/collaborator.tsx | 2 +- .../fleetbossbattles/crewchecklist.tsx | 10 +- .../fleetbossbattles/crewexporter.tsx | 2 +- .../fleetbossbattles/crewgroups.tsx | 2 +- src/components/fleetbossbattles/crewtable.tsx | 10 +- .../fleetbossbattles/listedtraits.tsx | 2 +- .../fleetbossbattles/markbuttons.tsx | 16 +- src/components/fleetbossbattles/traits.tsx | 4 +- src/components/ftm/ftmhof.tsx | 14 +- src/components/gather/gather_planner.tsx | 2 +- src/components/gauntlet/dataprovider.tsx | 2 +- src/components/gauntlet/gauntletheader.tsx | 6 +- src/components/gauntlet/gauntletimporter.tsx | 2 +- .../gauntlet/gauntletprefspanel.tsx | 2 +- src/components/gauntlet/gauntlettable.tsx | 2 +- src/components/gauntlet/opponenttable.tsx | 2 +- src/components/gauntlet/paircard.tsx | 14 +- src/components/gauntlet/pairtable.tsx | 2 +- src/components/gauntlet/settings.tsx | 4 +- src/components/hof/hofdetails.tsx | 6 +- src/components/hof/periodstats.tsx | 8 +- src/components/hof/voyagehof.tsx | 4 +- src/components/hovering/crewhoverstat.tsx | 6 +- src/components/hovering/hoverstat.tsx | 4 +- src/components/hovering/itemhoverstat.tsx | 4 +- src/components/hovering/shiphoverstat.tsx | 4 +- src/components/item_presenters/avatarview.tsx | 22 +- .../item_presenters/classic_presenter.tsx | 16 +- src/components/item_presenters/crew_items.tsx | 8 +- .../item_presenters/crew_presenter.tsx | 6 +- src/components/item_presenters/crew_ranks.tsx | 12 +- src/components/item_presenters/crewstat.tsx | 4 +- .../item_presenters/gauntletskill.tsx | 6 +- .../item_presenters/item_presenter.tsx | 8 +- .../item_presenters/presenter_utils.tsx | 6 +- .../item_presenters/ship_presenter.tsx | 6 +- src/components/item_presenters/shipskill.tsx | 6 +- src/components/itemdisplay.tsx | 10 +- src/components/items/farmtable.tsx | 6 +- src/components/items/filters.tsx | 2 +- src/components/items/itemdropdown.tsx | 2 +- src/components/items/quipmentfilters.tsx | 4 +- src/components/items/utils.tsx | 6 +- src/components/itemsources.tsx | 4 +- src/components/missioncost.tsx | 10 +- src/components/missions/challenge_node.tsx | 2 +- src/components/missions/continuum_helper.tsx | 2 +- src/components/missions/path_crew_display.tsx | 4 +- src/components/missions/path_table.tsx | 20 +- src/components/missions/quest_crew_table.tsx | 4 +- src/components/missions/quest_importer.tsx | 2 +- src/components/missions/questdropdown.tsx | 2 +- src/components/missions/trait_selector.tsx | 2 +- .../mini_tools/mortal_helpers.tsx | 2 +- .../mini_tools/registered_tools.tsx | 2 +- .../mini_tools/slots_helper.tsx | 2 +- src/components/objective_events/oeinfo.tsx | 4 +- src/components/objective_events/oemodal.tsx | 2 +- src/components/objective_events/oepicker.tsx | 2 +- src/components/optimizer/btpresets.tsx | 4 +- src/components/optimizer/btsettings.tsx | 8 +- .../optimizer/citeoptimizer_old.tsx | 6 +- src/components/optimizer/citetable.tsx | 4 +- src/components/optimizer/context.tsx | 2 +- src/components/page/datapagelayout.tsx | 41 +- src/components/page/navigation.tsx | 28 +- src/components/page/notification.tsx | 2 +- src/components/page/playerbadge.tsx | 2 +- src/components/page/playerglance.tsx | 46 +- src/components/page/playermenu.tsx | 9 +- src/components/page/settings.tsx | 28 +- src/components/page/util.tsx | 8 +- src/components/playerdata/playerinfo.tsx | 2 +- src/components/playerdata/playerinputform.tsx | 4 +- src/components/playerdata/playershare.tsx | 10 +- src/components/profile_charts.tsx | 8 +- src/components/profile_crew2.tsx | 12 +- src/components/prospectpicker.tsx | 6 +- src/components/qpconfig/provider.tsx | 2 +- src/components/retrieval/celestialmarket.tsx | 2 +- src/components/retrieval/combos.tsx | 10 +- src/components/retrieval/combosgrid.tsx | 4 +- src/components/retrieval/combosplanner.tsx | 6 +- src/components/retrieval/context.tsx | 22 +- src/components/retrieval/crewtable.tsx | 10 +- src/components/retrieval/energy.tsx | 2 +- src/components/retrieval/polestarfilter.tsx | 8 +- .../retrieval/polestarmultiworker.tsx | 5 +- .../retrieval/polestarprospects.tsx | 14 +- src/components/retrieval/wishlist.tsx | 12 +- src/components/searchabletable.tsx | 16 +- src/components/ship/advancedpower.tsx | 8 +- src/components/ship/opponent_importer.tsx | 2 +- src/components/ship/rostercalc.tsx | 4 +- src/components/ship/shipmultiworker.tsx | 5 +- src/components/ship/shiptable.tsx | 6 +- src/components/ship/staffingview.tsx | 32 +- src/components/ship/utils.tsx | 2 +- src/components/shuttlehelper/assignments.tsx | 6 +- .../shuttlehelper/eventprojection.tsx | 18 +- src/components/shuttlehelper/helpermode.tsx | 20 +- .../shuttlehelper/missioneditor.tsx | 2 +- src/components/shuttlehelper/missions.tsx | 4 +- .../shuttlehelper/missionstable.tsx | 12 +- src/components/shuttlehelper/model.ts | 4 +- .../shuttlehelper/seatassignmentpicker.tsx | 6 +- src/components/specialist/crewmodal.tsx | 10 +- .../specialist/specialistmissions.tsx | 10 +- src/components/specialist/utils.tsx | 8 +- src/components/statlabel.tsx | 4 +- src/components/stats/charts/circle.tsx | 2 +- .../stats/charts/eventdistribution.tsx | 2 +- src/components/stats/charts/statscreep.tsx | 42 +- src/components/stats/dataprovider.tsx | 2 +- src/components/stats/statsmain.tsx | 4 +- src/components/stats/tables/releasetable.tsx | 4 +- src/components/stats/tables/traitdive.tsx | 25 +- src/components/stats/tables/traittable.tsx | 28 +- src/components/stats/utils.ts | 2 +- src/components/unneededitems.tsx | 4 +- src/components/vaultcrew.tsx | 26 +- .../voyagecalculator/calculator/bestship.tsx | 2 +- .../calculator/crewoptions.tsx | 11 +- .../voyagecalculator/calculator/errorpane.tsx | 7 +- .../voyagecalculator/calculator/results.tsx | 13 +- .../calculator/resultsgroup.tsx | 2 +- .../voyagecalculator/calculator/telemetry.tsx | 4 +- .../voyagecalculator/configcard.tsx | 8 +- .../voyagecalculator/configeditor.tsx | 6 +- .../voyagecalculator/crewthemes.tsx | 14 +- .../dilemmas/dilemmatable.tsx | 2 +- .../encounters/common/ranges.tsx | 4 +- .../contestsimulator/contestant.tsx | 18 +- .../contestsimulator/contestantpicker.tsx | 18 +- .../encounterhelper/boostpicker.tsx | 20 +- .../encounters/encounterhelper/champions.tsx | 14 +- .../encounters/encounterhelper/contests.tsx | 10 +- .../encounterhelper/contributors.tsx | 18 +- .../encounterhelper/encountercard.tsx | 4 +- .../encounterhelper/encounterimporter.tsx | 6 +- .../encounters/encounterhelper/simulator.tsx | 4 +- .../encounters/proficiencycheck/matrix.tsx | 10 +- .../proficiencycheck/proficiencycheck.tsx | 2 +- .../encounters/proficiencycheck/table.tsx | 12 +- .../voyagecalculator/encounters/vpgraph.tsx | 2 +- src/components/voyagecalculator/home.tsx | 12 +- .../voyagecalculator/lineupeditor/context.tsx | 2 +- .../lineupeditor/crewpicker.tsx | 22 +- .../lineupeditor/lineupeditor.tsx | 2 +- .../lineupeditor/slotpicker.tsx | 26 +- .../voyagecalculator/lineupeditor/summary.tsx | 20 +- .../lineupviewer/aggregates.tsx | 12 +- .../lineupviewer/assignmentcard.tsx | 16 +- .../lineupviewer/crewfinder.tsx | 2 +- .../lineupviewer/gridview.tsx | 8 +- .../lineupviewer/tableview.tsx | 20 +- .../quipment/quipmentpopover.tsx | 2 +- .../rewards/rewards_accordion.tsx | 8 +- .../skillcheck/skillcheck.tsx | 2 +- .../skillcheck/skilldetail.tsx | 12 +- .../voyagecalculator/stats/prettycost.tsx | 4 +- src/components/voyagehistory/crewtable.tsx | 12 +- .../voyagehistory/lootcrewtable.tsx | 2 +- src/components/voyagehistory/utils.ts | 14 +- src/components/voyagehistory/voyagemodal.tsx | 2 +- src/components/voyagehistory/voyagestable.tsx | 4 +- src/components/worfle/dailygame.tsx | 8 +- src/components/worfle/deductionlist.tsx | 6 +- src/components/worfle/game.tsx | 4 +- src/components/worfle/guesspicker.tsx | 10 +- src/components/worfle/guesstable.tsx | 12 +- src/components/worfle/hintpicker.tsx | 6 +- src/components/worfle/practicegame.tsx | 2 +- src/components/worfle/worfle.tsx | 2 +- src/context/datacontext.tsx | 12 +- src/context/energylogcontext.tsx | 8 +- src/context/globalcontext.tsx | 7 +- src/context/localizedcontext.tsx | 12 +- src/context/promptcontext.tsx | 2 +- src/context/workercontext.tsx | 2 +- src/cssdef.ts | 17 + src/index.css | 13 + src/logo.svg | 1 + src/model/equipment.ts | 2 +- src/model/game-elements.ts | 4 +- src/pages/announcements.tsx | 22 - src/pages/behold.tsx | 6 +- src/pages/bridgecrew.tsx | 6 +- src/pages/episodes.tsx | 2 +- src/pages/event_info.tsx | 6 +- src/pages/events.tsx | 4 +- src/pages/index.tsx | 1 - src/pages/item_info.tsx | 8 +- src/pages/playertools.tsx | 7 +- src/pages/profile.tsx | 14 +- src/pages/ship_info.tsx | 6 +- src/pages/voyagehistory.tsx | 2 +- src/react-app-env.d.ts | 1 + src/reportWebVitals.ts | 15 + src/setupTests.ts | 5 + src/templates/crewpage.tsx | 137 +- src/templates/episodepage.tsx | 10 +- src/templates/page.tsx | 12 - src/utils/assets.ts | 2 +- src/utils/gauntlet.ts | 2 +- src/utils/misc.ts | 2 +- src/utils/offers.ts | 4 +- src/webpack.config.js | 14 + tsconfig.json | 45 +- webpack.config.js | 14 + yarn.lock | 29061 +++++++++------- 304 files changed, 17633 insertions(+), 14508 deletions(-) create mode 100644 package_old.json create mode 100644 setupTests.ts create mode 100644 src/App.css create mode 100644 src/App.test.tsx create mode 100644 src/cssdef.ts create mode 100644 src/index.css create mode 100644 src/logo.svg create mode 100644 src/react-app-env.d.ts create mode 100644 src/reportWebVitals.ts create mode 100644 src/setupTests.ts create mode 100644 src/webpack.config.js create mode 100644 webpack.config.js diff --git a/.env.defaults b/.env.defaults index 3adc9e1977..52340e24d1 100644 --- a/.env.defaults +++ b/.env.defaults @@ -1,2 +1,2 @@ -GATSBY_DATACORE_URL= -GATSBY_ASSETS_URL= \ No newline at end of file +REACT_DATACORE_URL= +REACT_ASSETS_URL= \ No newline at end of file diff --git a/.github/workflows/beta_deploy.yml b/.github/workflows/beta_deploy.yml index 171bb586d9..6c7e11d5cc 100644 --- a/.github/workflows/beta_deploy.yml +++ b/.github/workflows/beta_deploy.yml @@ -35,8 +35,8 @@ jobs: # Runs a single command using the runners shell - name: Build project env: - GATSBY_DATACORE_URL: https://beta.datacore.app/ - GATSBY_ASSETS_URL: https://assets.datacore.app/ + REACT_DATACORE_URL: https://beta.datacore.app/ + REACT_ASSETS_URL: https://assets.datacore.app/ CLOUDFLARE_TOKEN: ${{ secrets.CLOUDFLARE_TOKEN }} CLOUDFLARE_ZONE_ID: ${{ secrets.CLOUDFLARE_ZONE_ID }} run: | diff --git a/.github/workflows/deploy_test.yml_disabled b/.github/workflows/deploy_test.yml_disabled index db5f2687b2..941c6f9716 100644 --- a/.github/workflows/deploy_test.yml_disabled +++ b/.github/workflows/deploy_test.yml_disabled @@ -9,8 +9,8 @@ jobs: - uses: actions/checkout@v2 - name: Build project env: - GATSBY_DATACORE_URL: https://test.datacore.app/ - GATSBY_ASSETS_URL: https://assets.datacore.app/ + REACT_DATACORE_URL: https://test.datacore.app/ + REACT_ASSETS_URL: https://assets.datacore.app/ run: | yarn install yarn run build diff --git a/.github/workflows/dev_deploy.yml b/.github/workflows/dev_deploy.yml index b894acdcc0..9901138add 100644 --- a/.github/workflows/dev_deploy.yml +++ b/.github/workflows/dev_deploy.yml @@ -35,8 +35,8 @@ jobs: # Runs a single command using the runners shell - name: Build project env: - GATSBY_DATACORE_URL: https://dev.datacore.app/ - GATSBY_ASSETS_URL: https://assets.datacore.app/ + REACT_DATACORE_URL: https://dev.datacore.app/ + REACT_ASSETS_URL: https://assets.datacore.app/ CLOUDFLARE_TOKEN: ${{ secrets.CLOUDFLARE_TOKEN }} CLOUDFLARE_ZONE_ID: ${{ secrets.CLOUDFLARE_ZONE_ID }} run: | diff --git a/.github/workflows/pr_build.yml b/.github/workflows/pr_build.yml index a1071a2cbe..6b688ad3f4 100644 --- a/.github/workflows/pr_build.yml +++ b/.github/workflows/pr_build.yml @@ -15,8 +15,8 @@ jobs: - name: Run cypress tests env: - GATSBY_DATACORE_URL: https://datacore.app/ - GATSBY_ASSETS_URL: https://assets.datacore.app/ + REACT_DATACORE_URL: https://datacore.app/ + REACT_ASSETS_URL: https://assets.datacore.app/ uses: cypress-io/github-action@v6 with: install-command: yarn install diff --git a/.github/workflows/prod_deploy.yml b/.github/workflows/prod_deploy.yml index 594ded8100..bdd4848d19 100644 --- a/.github/workflows/prod_deploy.yml +++ b/.github/workflows/prod_deploy.yml @@ -28,8 +28,8 @@ jobs: # Runs a single command using the runners shell - name: Build project env: - GATSBY_DATACORE_URL: https://datacore.app/ - GATSBY_ASSETS_URL: https://assets.datacore.app/ + REACT_DATACORE_URL: https://datacore.app/ + REACT_ASSETS_URL: https://assets.datacore.app/ CLOUDFLARE_TOKEN: ${{ secrets.CLOUDFLARE_TOKEN }} CLOUDFLARE_ZONE_ID: ${{ secrets.CLOUDFLARE_ZONE_ID }} run: | diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index cdeebe5a77..972a0c43a9 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -3,7 +3,7 @@ Contributions are always welcome, no matter how large or small. Before contributing, please read the [code of conduct](CODE_OF_CONDUCT.md). -If you want to contribute content (CMS pages, BigBook additions, use the website form for a nicer editing interface), or submit PRs here with the MarkDown changes. All information on characters, events and related content is automatically generated from various external sources. Therefore we do not require manual contibutions related to in game content. +If you want to contribute content (CMS pages, BigBook additions, use the website form for a nicer editing interface), or submit PRs here with the MarkDown changes. All information on characters, events and related content is automatically generated from various external sources. Therefore we do not require manual contibutions related to in game content. If you want to contribute code fixes, see below. @@ -15,14 +15,14 @@ If you want to contribute code fixes, see below. ```sh $ git clone https://github.com/stt-datacore/website.git -$ yarn install +$ yarn install ``` -In order to get images on your server you have to run the command. +In order to get images on your server you have to run the command. ```sh $ cp .env.default .env ``` -Then change the line "GATSBY_ASSETS_URL=" to "GATSBY_ASSETS_URL=http://assets.datacore.app/". +Then change the line "REACT_ASSETS_URL=" to "REACT_ASSETS_URL=http://assets.datacore.app/". ## Available scripts @@ -48,7 +48,7 @@ $ yarn run build ### `serve` -This command is shorthand for `gatsby serve` +This command is shorthand for `gatsby serve` #### Usage diff --git a/package.json b/package.json index e437e55e4f..8a52ac30a0 100644 --- a/package.json +++ b/package.json @@ -1,101 +1,93 @@ { - "name": "stt-data-core", - "description": "STT DataCore", - "author": "ussjohnjay/ironyWrit", - "version": "3.4.0", - "license": "MIT", - "scripts": { - "check": "tsc --noEmit", - "precalculate": "yarn tsc --project ./tsconfig.node.json && node build/scripts/precalculate.js", - "build": "gatsby build", - "buildci": "gatsby build && rimraf ./public/media/assets", - "clean": "gatsby clean", - "develop": "gatsby develop -p 8881 -H 0.0.0.0", - "format": "prettier --write src/**/*.{js,jsx,ts,tsx}", - "start": "yarn run develop", - "serve": "gatsby serve", - "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\"", - "cy:open": "cypress open", - "test:e2e": "start-server-and-test develop http://localhost:8881 cy:open" - }, - "overrides": { - "react-server-dom-webpack@0.0.0-experimental-c8b778b7f-20220825": { - "react": "^18.0.0" + "name": "stt-data-core", + "description": "STT DataCore", + "author": "ussjohnjay/ironyWrit", + "version": "4.0.0", + "license": "MIT", + "scripts": { + "start": "react-scripts start", + "build": "react-scripts build", + "test": "react-scripts test", + "eject": "react-scripts eject" + }, + "dependencies": { + "@nivo/bar": "^0.99.0", + "@nivo/boxplot": "^0.99.0", + "@nivo/bump": "^0.99.0", + "@nivo/calendar": "^0.99.0", + "@nivo/chord": "^0.99.0", + "@nivo/circle-packing": "^0.99.0", + "@nivo/core": "^0.99.0", + "@nivo/line": "^0.99.0", + "@nivo/pie": "^0.99.0", + "@nivo/radar": "^0.99.0", + "@nivo/sunburst": "^0.99.0", + "@nivo/swarmplot": "^0.99.0", + "color-convert": "^3.0.1", + "cypress": "^15.14.2", + "easymde": "^2.18.0", + "exceljs": "^4.4.0", + "localforage": "^1.10.0", + "lz-string": "^1.5.0", + "marked": "^12.0.1", + "moment": "^2.30.1", + "react": "^19.1.0", + "react-device-detect": "^2.2.3", + "react-dom": "^19.1.0", + "react-helmet": "^6.1.0", + "react-intersection-observer": "^10.0.3", + "react-router-dom": "^7.7.0", + "react-scripts": "5.0.1", + "search-string": "^4.1.0", + "seedrandom": "^3.0.5", + "semantic-ui-css": "^2.5.0", + "semantic-ui-react": "3.0.0-beta.2", + "tinycolor2": "^1.6.0", + "uuid": "^14.0.0", + "web-vitals": "^2.1.0", + "write": "^2.0.0" + }, + "repository": { + "type": "git", + "url": "https://github.com/stt-datacore/website" + }, + "bugs": { + "url": "https://github.com/stt-datacore/website/issues" + }, + "eslintConfig": { + "extends": [ + "react-app", + "react-app/jest" + ], + "rules": { + "react-hooks/exhaustive-deps": "off" + } + }, + "browserslist": { + "production": [ + ">0.2%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] + }, + "devDependencies": { + "@types/color-convert": "^3.0.1", + "@types/localforage": "^0.0.34", + "@types/node": "^16.7.13", + "@types/react": "^19.0.0", + "@types/react-dom": "^19.0.0", + "@types/react-helmet": "^6.1.11", + "@types/showdown": "^2.0.6", + "@types/tinycolor2": "^1.4.6", + "@types/uuid": "^11.0.0", + "dotenv": "^17.4.2", + "showdown": "^2.1.0", + "start-server-and-test": "^3.0.2", + "typescript": "^5.7.3" } - }, - "dependencies": { - "@babel/helpers": "7.27.1", - "@babel/runtime": "7.27.1", - "@nivo/bar": "^0.99.0", - "@nivo/boxplot": "^0.99.0", - "@nivo/bump": "^0.99.0", - "@nivo/calendar": "^0.99.0", - "@nivo/chord": "^0.99.0", - "@nivo/circle-packing": "^0.99.0", - "@nivo/core": "^0.99.0", - "@nivo/line": "^0.99.0", - "@nivo/pie": "^0.99.0", - "@nivo/radar": "^0.99.0", - "@nivo/sunburst": "^0.99.0", - "@nivo/swarmplot": "^0.99.0", - "@sentry/gatsby": "^10.47.0", - "axios": "^1.14.0", - "base-x": "3.0.11", - "color-convert": "^2.0.1", - "easymde": "^2.18.0", - "exceljs": "^4.4.0", - "gatsby": "^5.13.4", - "gatsby-plugin-manifest": "^5.13.1", - "gatsby-plugin-purge-cloudflare-cache": "^0.0.3", - "gatsby-plugin-react-helmet": "^6.13.1", - "gatsby-plugin-remove-fingerprints": "^0.0.2", - "gatsby-plugin-sitemap": "^6.13.1", - "gatsby-plugin-typescript": "^5.13.1", - "gatsby-source-filesystem": "^5.13.1", - "gatsby-transformer-json": "^5.13.1", - "gatsby-transformer-remark": "^6.13.1", - "js-yaml": "3.14.2", - "localforage": "^1.10.0", - "lodash-es": "^4.17.21", - "lodash.combinations": "^18.11.1", - "lz-string": "^1.5.0", - "marked": "^12.0.1", - "moment": "^2.30.1", - "react": "^18.2.0", - "react-device-detect": "^2.2.3", - "react-dom": "^18.2.0", - "react-helmet": "^6.1.0", - "react-intersection-observer": "^9.16.0", - "react-simplemde-editor": "^5.2.0", - "search-string": "^3.1.0", - "seedrandom": "^3.0.5", - "semantic-ui-css": "^2.5.0", - "semantic-ui-react": "^2.1.5", - "tinycolor2": "^1.6.0", - "uuid": "^9.0.1", - "write": "^2.0.0" - }, - "repository": { - "type": "git", - "url": "https://github.com/stt-datacore/website" - }, - "bugs": { - "url": "https://github.com/stt-datacore/website/issues" - }, - "devDependencies": { - "@types/color-convert": "^2.0.4", - "@types/lodash-es": "^4.17.12", - "@types/node": "^22.9.0", - "@types/react": "^18.2.0", - "@types/react-helmet": "^6.1.11", - "@types/showdown": "^2.0.6", - "@types/tinycolor2": "^1.4.6", - "@types/uuid": "^9.0.8", - "cypress": "^13.8.0", - "dotenv": "^16.4.5", - "showdown": "^2.0.6", - "start-server-and-test": "^2.0.3", - "typescript": "^5.7.3" - }, - "packageManager": "yarn@1.22.22" } diff --git a/package_old.json b/package_old.json new file mode 100644 index 0000000000..622c62e6a2 --- /dev/null +++ b/package_old.json @@ -0,0 +1,101 @@ +{ + "name": "stt-data-core", + "description": "STT DataCore", + "author": "ussjohnjay/ironyWrit", + "version": "4.0.0", + "license": "MIT", + "scripts": { + "check": "tsc --noEmit", + "precalculate": "yarn tsc --project ./tsconfig.node.json && node build/scripts/precalculate.js", + "build": "gatsby build", + "buildci": "gatsby build && rimraf ./public/media/assets", + "clean": "gatsby clean", + "develop": "gatsby develop -p 8881 -H 0.0.0.0", + "format": "prettier --write src/**/*.{js,jsx,ts,tsx}", + "start": "yarn run develop", + "serve": "gatsby serve", + "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\"", + "cy:open": "cypress open", + "test:e2e": "start-server-and-test develop http://localhost:8881 cy:open" + }, + "overrides": { + "react-server-dom-webpack@0.0.0-experimental-c8b778b7f-20220825": { + "react": "^18.0.0" + } + }, + "dependencies": { + "@babel/helpers": "7.27.1", + "@babel/runtime": "7.27.1", + "@nivo/bar": "^0.99.0", + "@nivo/boxplot": "^0.99.0", + "@nivo/bump": "^0.99.0", + "@nivo/calendar": "^0.99.0", + "@nivo/chord": "^0.99.0", + "@nivo/circle-packing": "^0.99.0", + "@nivo/core": "^0.99.0", + "@nivo/line": "^0.99.0", + "@nivo/pie": "^0.99.0", + "@nivo/radar": "^0.99.0", + "@nivo/sunburst": "^0.99.0", + "@nivo/swarmplot": "^0.99.0", + "@sentry/gatsby": "^10.47.0", + "axios": "^1.14.0", + "base-x": "3.0.11", + "color-convert": "^2.0.1", + "easymde": "^2.18.0", + "exceljs": "^4.4.0", + "gatsby": "^5.13.4", + "gatsby-plugin-manifest": "^5.13.1", + "gatsby-plugin-purge-cloudflare-cache": "^0.0.3", + "gatsby-plugin-react-helmet": "^6.13.1", + "gatsby-plugin-remove-fingerprints": "^0.0.2", + "gatsby-plugin-sitemap": "^6.13.1", + "gatsby-plugin-typescript": "^5.13.1", + "gatsby-source-filesystem": "^5.13.1", + "gatsby-transformer-json": "^5.13.1", + "gatsby-transformer-remark": "^6.13.1", + "js-yaml": "3.14.2", + "localforage": "^1.10.0", + "lodash-es": "^4.17.21", + "lodash.combinations": "^18.11.1", + "lz-string": "^1.5.0", + "marked": "^12.0.1", + "moment": "^2.30.1", + "react": "^18.2.0", + "react-device-detect": "^2.2.3", + "react-dom": "^18.2.0", + "react-helmet": "^6.1.0", + "react-intersection-observer": "^9.16.0", + "react-simplemde-editor": "^5.2.0", + "search-string": "^3.1.0", + "seedrandom": "^3.0.5", + "semantic-ui-css": "^2.5.0", + "semantic-ui-react": "^2.1.5", + "tinycolor2": "^1.6.0", + "uuid": "^9.0.1", + "write": "^2.0.0" + }, + "repository": { + "type": "git", + "url": "https://github.com/stt-datacore/website" + }, + "bugs": { + "url": "https://github.com/stt-datacore/website/issues" + }, + "devDependencies": { + "@types/color-convert": "^2.0.4", + "@types/lodash-es": "^4.17.12", + "@types/node": "^22.9.0", + "@types/react": "^18.2.0", + "@types/react-helmet": "^6.1.11", + "@types/showdown": "^2.0.6", + "@types/tinycolor2": "^1.4.6", + "@types/uuid": "^9.0.8", + "cypress": "^13.8.0", + "dotenv": "^16.4.5", + "showdown": "^2.0.6", + "start-server-and-test": "^2.0.3", + "typescript": "^5.7.3" + }, + "packageManager": "yarn@1.22.22" +} diff --git a/setupTests.ts b/setupTests.ts new file mode 100644 index 0000000000..8f2609b7b3 --- /dev/null +++ b/setupTests.ts @@ -0,0 +1,5 @@ +// jest-dom adds custom jest matchers for asserting on DOM nodes. +// allows you to do things like: +// expect(element).toHaveTextContent(/react/i) +// learn more: https://github.com/testing-library/jest-dom +import '@testing-library/jest-dom'; diff --git a/src/App.css b/src/App.css new file mode 100644 index 0000000000..74b5e05345 --- /dev/null +++ b/src/App.css @@ -0,0 +1,38 @@ +.App { + text-align: center; +} + +.App-logo { + height: 40vmin; + pointer-events: none; +} + +@media (prefers-reduced-motion: no-preference) { + .App-logo { + animation: App-logo-spin infinite 20s linear; + } +} + +.App-header { + background-color: #282c34; + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-size: calc(10px + 2vmin); + color: white; +} + +.App-link { + color: #61dafb; +} + +@keyframes App-logo-spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} diff --git a/src/App.test.tsx b/src/App.test.tsx new file mode 100644 index 0000000000..2a68616d98 --- /dev/null +++ b/src/App.test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import { render, screen } from '@testing-library/react'; +import App from './App'; + +test('renders learn react link', () => { + render(); + const linkElement = screen.getByText(/learn react/i); + expect(linkElement).toBeInTheDocument(); +}); diff --git a/src/components/alerts/alertmodal.tsx b/src/components/alerts/alertmodal.tsx index f67429a6e8..686712a198 100644 --- a/src/components/alerts/alertmodal.tsx +++ b/src/components/alerts/alertmodal.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import { Modal, Input, Button, Checkbox } from 'semantic-ui-react'; +import { Button, Checkbox, Input, Modal } from 'semantic-ui-react'; import { GlobalContext } from '../../context/globalcontext'; +import { CrewDropDown } from '../base/crewdropdown'; import { OptionsBase } from '../base/optionsmodal_base'; import { AlertModalProps, DefaultAlertConfig, IAlertConfig } from './model'; -import { CrewDropDown } from '../base/crewdropdown'; export const AlertModal = (props: AlertModalProps) => { const globalContext = React.useContext(GlobalContext); @@ -11,7 +11,7 @@ export const AlertModal = (props: AlertModalProps) => { const { t, tfmt } = globalContext.localized; const { config, setConfig } = props; const [modalIsOpen, setModalIsOpen] = React.useState(false); - const inputRef = React.createRef(); + const inputRef = React.createRef(); const [workConf, setWorkConf] = React.useState(config); const [innerSettings, setInnerSettings] = React.useState(DefaultAlertConfig); @@ -150,7 +150,7 @@ export const AlertModal = (props: AlertModalProps) => { setModalIsOpen(false); } - function renderDefaultTrigger(): JSX.Element { + function renderDefaultTrigger(): React.ReactNode { return ( ) : (<>)); // return ( @@ -429,8 +429,8 @@ // ) // } -// function createFilterCheckboxes(): JSX.Element[] { -// const checkboxes = [] as JSX.Element[]; +// function createFilterCheckboxes(): React.ReactNode[] { +// const checkboxes = [] as React.ReactNode[]; // grouped.map((group) => { // if(group.polestars.length > 0) { // checkboxes.push(filterCheckboxGroupHeader(group.title)); @@ -522,7 +522,7 @@ // // ); -// function renderContent(): JSX.Element { +// function renderContent(): React.ReactNode { // if (!modalIsOpen) return (<>); // if (!allKeystones || !allKeystones.length) { @@ -585,7 +585,7 @@ // setControl([...unretrievable]); // } -// function renderPolestarFinder(): JSX.Element { +// function renderPolestarFinder(): React.ReactNode { // const polestarTable: ITableConfigRow[] = [ // { width: 2, column: 'name', title: 'Polestar' }, // { width: 1, column: 'crew_count', title: 'Crew in Portal', reverse: true }, @@ -688,7 +688,7 @@ // return meetsAnyCondition; // } -// function renderPolestarRow(polestar: Polestar, idx: number): JSX.Element { +// function renderPolestarRow(polestar: Polestar, idx: number): React.ReactNode { // return ( // //
-// +// //
//
// {polestar.short_name} @@ -723,7 +723,7 @@ // ); // } -// function renderCrewMessage(data: Polestar[]): JSX.Element { +// function renderCrewMessage(data: Polestar[]): React.ReactNode { // if (activeCrew == '') return (<>); // const crew = allCrew.find(c => c.symbol === activeCrew); @@ -796,14 +796,14 @@ // ); // } -// function renderPolestarsInline(polestars: Polestar[]): JSX.Element[] { +// function renderPolestarsInline(polestars: Polestar[]): React.ReactNode[] { // var mp = polestars.map((p, pdx) => ( // setActivePolestar(p.symbol) }> // {p.short_name}{pdx < polestars.length-1 ? ',' : ''} // // )); -// let retval: JSX.Element[] = []; +// let retval: React.ReactNode[] = []; // let i = 0; // for (var cm of mp) { // if (i++) retval.push(<> ); @@ -813,7 +813,7 @@ // return retval; // } -// function renderConstellationMessage(data: Polestar[]): JSX.Element { +// function renderConstellationMessage(data: Polestar[]): React.ReactNode { // if (activeConstellation == '') return (<>); // const constellation = allKeystones.find(k => k.symbol === activeConstellation) as Constellation | undefined; @@ -830,7 +830,7 @@ // ); // } -// function renderPolestarDetail(): JSX.Element { +// function renderPolestarDetail(): React.ReactNode { // const polestar = allKeystones.find(k => k.symbol === activePolestar) as Polestar ?? {} as Polestar; // polestar.loaned = addedPolestars.filter(added => added === polestar.symbol).length; @@ -858,7 +858,7 @@ // ); // } -// function renderPolestarsFromConstellation(constellation: Constellation, polestars: Polestar[]): JSX.Element { +// function renderPolestarsFromConstellation(constellation: Constellation, polestars: Polestar[]): React.ReactNode { // const clarify = activeCrew != '' ? 'a needed' : 'an unowned'; // return ( @@ -869,7 +869,7 @@ // { // polestars.map((p, pdx) => ( // setActivePolestar(p.symbol)}> -// +// //
{p.short_name}
({(1/constellation.keystones.length*100).toFixed(1)}%) // // )) @@ -880,7 +880,7 @@ // ); // } -// function renderConstellationsWithPolestar(polestar: Polestar): JSX.Element { +// function renderConstellationsWithPolestar(polestar: Polestar): React.ReactNode { // const constellations = [] as Constellation[]; // ownedConstellations.filter(k => k.keystones.includes(polestar.id)) // .forEach(k => { @@ -906,7 +906,7 @@ // ); // } -// function renderNewRetrievals(polestar: Polestar): JSX.Element { +// function renderNewRetrievals(polestar: Polestar): React.ReactNode { // const ownedPlus = structuredClone(ownedPolestars); // ownedPlus.push({...polestar, quantity: 1}); // const newRetrievables = getRetrievable(control, ownedPlus).filter(c => c.in_portal); @@ -926,7 +926,7 @@ // {newRetrievables.sort((a, b) => a.name.localeCompare(b.name)).map((crew, cdx) => ( // setAsActive('crew', crew.symbol) }> // c.symbol === props.value); -// if (c) options.list = [{ key: c.symbol, value: c.symbol, text: c.name, image: { avatar: true, src: `${process.env.GATSBY_ASSETS_URL}${c.imageUrlPortrait}` }}]; +// if (c) options.list = [{ key: c.symbol, value: c.symbol, text: c.name, image: { avatar: true, src: `${process.env.REACT_ASSETS_URL}${c.imageUrlPortrait}` }}]; // else options.list = [{ key: 0, value: 0, text: 'Loading...' }]; // } // else { @@ -1021,7 +1021,7 @@ // let crewList = [...props.crew]; // let newOptions: RetrievalOptions = { // list: crewList.sort((a, b) => a.name.localeCompare(b.name)).map(c => { -// return { key: c.symbol, value: c.symbol, text: c.name, image: { avatar: true, src: `${process.env.GATSBY_ASSETS_URL}${c.imageUrlPortrait}` }}; +// return { key: c.symbol, value: c.symbol, text: c.name, image: { avatar: true, src: `${process.env.REACT_ASSETS_URL}${c.imageUrlPortrait}` }}; // }), // initialized: true // } @@ -1068,7 +1068,7 @@ // setAlgo: (value: string) => void; // }; -// const AlgoExplain = (props: { comboCount?: number }): JSX.Element => { +// const AlgoExplain = (props: { comboCount?: number }): React.ReactNode => { // const comboCount = props.comboCount; // let pt: number | undefined = undefined; // let st: string | undefined = undefined; @@ -1132,7 +1132,7 @@ -// function renderTableRow(crew: PlayerCrew, idx: number, playerData: PlayerData): JSX.Element { +// function renderTableRow(crew: PlayerCrew, idx: number, playerData: PlayerData): React.ReactNode { // const buffConfig = dataContext.player.buffConfig; // const [comboCount, ] = getCombos(crew); @@ -1149,7 +1149,7 @@ // > //
// -// +// // //
//
@@ -1239,7 +1239,7 @@ // return result; // } -// function showCombosForCrew(crew: CrewMember, algo: string): JSX.Element { +// function showCombosForCrew(crew: CrewMember, algo: string): React.ReactNode { // if (activeCrew !== crew.symbol) return (<>); // let [comboCount, combos] = getCombos(crew, true); @@ -1424,7 +1424,7 @@ // return fuseGroups; // } -// function showCollectionsForCrew(crew: CrewMember | PlayerCrew): JSX.Element { +// function showCollectionsForCrew(crew: CrewMember | PlayerCrew): React.ReactNode { // if (activeCollections !== crew.symbol || crew.collections.length == 0) // return ({crew.collections.length}); @@ -1508,7 +1508,7 @@ // // {combo.map((polestar, pdx) => ( // -// +// //
{polestar?.short_name} //
({polestar?.loaned ? `${polestar.quantity-polestar.loaned} +${polestar.loaned} added` : polestar?.quantity}) // diff --git a/src/components/crewtables/commonoptions.tsx b/src/components/crewtables/commonoptions.tsx index 70def8819d..a5ad63e63f 100644 --- a/src/components/crewtables/commonoptions.tsx +++ b/src/components/crewtables/commonoptions.tsx @@ -77,7 +77,7 @@ export const CrewTraitFilter = (props: CrewTraitFilterProps) => { key: trait, value: trait, text: TRAIT_NAMES[trait], - //content:
{TRAIT_NAMES[trait]}
+ //content:
{TRAIT_NAMES[trait]}
} as TraitOptions; }).sort((a, b) => a.text.localeCompare(b.text)); // [ ...CONFIG.SERIES].reverse().forEach(series => { @@ -152,7 +152,7 @@ export const CrewTraitFilter = (props: CrewTraitFilterProps) => { }; -export function descriptionLabel(t: TranslateMethod, crew: IRosterCrew, showOwned?: boolean, special?: boolean): JSX.Element { +export function descriptionLabel(t: TranslateMethod, crew: IRosterCrew, showOwned?: boolean, special?: boolean): React.ReactNode { const counts = [ { name: crew.collections.length !== 1 ? t('base.collections_fmt', { count: crew.collections.length.toString() }) : t('base.collection_fmt'), count: crew.collections.length } diff --git a/src/components/crewtables/crewconfigtable.tsx b/src/components/crewtables/crewconfigtable.tsx index 6fb08e7b75..26bd707524 100644 --- a/src/components/crewtables/crewconfigtable.tsx +++ b/src/components/crewtables/crewconfigtable.tsx @@ -1,20 +1,18 @@ import React from 'react'; -import { Link } from 'gatsby'; -import { Table, Rating, Checkbox, Button } from 'semantic-ui-react'; +import { Link } from 'react-router-dom'; +import { Rating, Table } from 'semantic-ui-react'; -import { InitialOptions, LockedProspect } from '../../model/game-elements'; -import { GlobalContext } from '../../context/globalcontext'; -import { SearchableTable, ITableConfigRow } from '../../components/searchabletable'; import { CrewHoverStat, CrewTarget } from '../../components/hovering/crewhoverstat'; +import { ITableConfigRow, SearchableTable } from '../../components/searchabletable'; +import { GlobalContext } from '../../context/globalcontext'; +import { InitialOptions, LockedProspect } from '../../model/game-elements'; import { crewMatchesSearchFilter } from '../../utils/crewsearch'; -import { IRosterCrew, RosterType, ICrewFilter } from './model'; +import { ItemHoverStat } from '../hovering/itemhoverstat'; +import { printAM } from '../retrieval/context'; import { descriptionLabel, SpecialViews } from './commonoptions'; import { CrewTraitMatchesCell } from './filters/crewtraits'; -import { ItemHoverStat } from '../hovering/itemhoverstat'; -import { OptionsPanelFlexRow } from '../stats/utils'; -import { CompletionState } from '../../model/player'; -import { printAM, printChrons } from '../retrieval/context'; +import { ICrewFilter, IRosterCrew, RosterType } from './model'; type CrewConfigTableProps = { pageId: string; @@ -23,10 +21,10 @@ type CrewConfigTableProps = { rosterCrew: IRosterCrew[]; crewFilters: ICrewFilter[]; tableConfig?: ITableConfigRow[]; - renderTableCells?: (crew: IRosterCrew) => JSX.Element; + renderTableCells?: (crew: IRosterCrew) => React.ReactNode; lockableCrew?: LockedProspect[]; loading?: boolean; - extraSearchContent?: JSX.Element; + extraSearchContent?: React.ReactNode; specialView?: SpecialViews; }; @@ -112,7 +110,7 @@ export const CrewConfigTable = (props: CrewConfigTableProps) => { return crewMatchesSearchFilter(crew, filters, filterType); } - function renderTableRow(crew: IRosterCrew, idx: number, highlighted: boolean, setCrew: React.Dispatch> | undefined = undefined): JSX.Element { + function renderTableRow(crew: IRosterCrew, idx: number, highlighted: boolean, setCrew: React.Dispatch> | undefined = undefined): React.ReactNode { const attributes = { positive: highlighted }; @@ -136,7 +134,7 @@ export const CrewConfigTable = (props: CrewConfigTableProps) => { >
- +
diff --git a/src/components/crewtables/customviews.tsx b/src/components/crewtables/customviews.tsx index 95d4764f01..ba5b892c6a 100644 --- a/src/components/crewtables/customviews.tsx +++ b/src/components/crewtables/customviews.tsx @@ -4,9 +4,9 @@ import { PlayerCrew } from "../../model/player"; /** * Crew View Filter Panes to be enabled. - * + * * These values can be OR'd together. - * + * * Any false-y value will activate all available panes. */ export enum CrewFilterPanes { @@ -14,7 +14,7 @@ export enum CrewFilterPanes { /** Show all Panes */ All = 0, - /** Show base stats */ + /** Show base stats */ BaseStats = 1, /** Show ship stats */ @@ -33,14 +33,14 @@ export interface CrewTableCustomFilter { title: string; } -export interface FilterItemMethodConfig { - index: number, - filterItem: (value: T) => boolean +export interface FilterItemMethodConfig { + index: number, + filterItem: (value: T) => boolean } export interface CustomFilterProps { index: number; - setFilterItemMethod: (props: FilterItemMethodConfig) => void; + setFilterItemMethod: (props: FilterItemMethodConfig) => void; } export abstract class CustomFilterComponentBase> extends React.Component { @@ -52,7 +52,7 @@ export abstract class CustomFilterComponentBase { showFilterOptions?: boolean; showPermalink?: boolean; lockable?: any[]; - zeroMessage?: (searchFilter: string) => JSX.Element; + zeroMessage?: (searchFilter: string) => React.ReactNode; toolCaption?: string; @@ -92,7 +92,7 @@ const pagingOptions = [ export enum SortDirection { Ascending = 'ascending', - Descending = 'descending' + Descending = 'descending' } export interface SortConfig { @@ -103,7 +103,7 @@ export interface SortConfig { export interface ITableConfigRow { width: number; column?: string; - title: string | JSX.Element; + title: string | React.ReactNode; pseudocolumns?: string[]; reverse?: boolean; tiebreakers?: string[]; @@ -138,13 +138,13 @@ export class CustomSearchableViewBase(name: string): [T, (value: T) => void] { return [ this.state[name], (value: T) => this.setState((prevState) => { prevState[name] = value; return prevState; }) ] }; - + diff --git a/src/components/crewtables/filters/cheapestfffe.tsx b/src/components/crewtables/filters/cheapestfffe.tsx index 9257ee0f02..928185fe2c 100644 --- a/src/components/crewtables/filters/cheapestfffe.tsx +++ b/src/components/crewtables/filters/cheapestfffe.tsx @@ -1,8 +1,7 @@ -import React from "react" +import React from "react"; +import { Checkbox, Dropdown, DropdownItemProps } from "semantic-ui-react"; import { GlobalContext } from "../../../context/globalcontext"; import CONFIG from "../../CONFIG"; -import { Checkbox, Dropdown, DropdownItemProps } from "semantic-ui-react"; -import { OptionsPanelFlexColumn } from "../../stats/utils"; export interface CheapestConfig { diff --git a/src/components/crewtables/filters/crewmaintenance.tsx b/src/components/crewtables/filters/crewmaintenance.tsx index d2e154d7d6..5dcd9e8efb 100644 --- a/src/components/crewtables/filters/crewmaintenance.tsx +++ b/src/components/crewtables/filters/crewmaintenance.tsx @@ -1,12 +1,10 @@ import React from 'react'; -import { Form, Dropdown } from 'semantic-ui-react'; +import { Dropdown, Form } from 'semantic-ui-react'; -import { IRosterCrew, ICrewFilter } from '../../../components/crewtables/model'; -import { CompletionState } from '../../../model/player'; +import { ICrewFilter, IRosterCrew } from '../../../components/crewtables/model'; import { GlobalContext } from '../../../context/globalcontext'; -import { getCrewQuipment, isQuipped } from '../../../utils/crewutils'; -import { EquipmentItem } from '../../../model/equipment'; -import { getPossibleQuipment } from '../../../utils/itemutils'; +import { CompletionState } from '../../../model/player'; +import { isQuipped } from '../../../utils/crewutils'; type CrewMaintenanceFilterProps = { pageId: string; diff --git a/src/components/crewtables/filters/crewobtained.tsx b/src/components/crewtables/filters/crewobtained.tsx index 119ee88226..80cf02e252 100644 --- a/src/components/crewtables/filters/crewobtained.tsx +++ b/src/components/crewtables/filters/crewobtained.tsx @@ -1,8 +1,7 @@ import React from 'react'; -import { Form, Dropdown, DropdownItemProps } from 'semantic-ui-react'; +import { Dropdown, DropdownItemProps, Form } from 'semantic-ui-react'; -import { IRosterCrew, ICrewFilter } from '../../../components/crewtables/model'; -import { printPortalStatus } from '../../../utils/crewutils'; +import { ICrewFilter, IRosterCrew } from '../../../components/crewtables/model'; import { GlobalContext } from '../../../context/globalcontext'; type ObtainedFilterProps = { diff --git a/src/components/crewtables/filters/crewofferfilter.tsx b/src/components/crewtables/filters/crewofferfilter.tsx index fd78b7fd69..f13a24c6ff 100644 --- a/src/components/crewtables/filters/crewofferfilter.tsx +++ b/src/components/crewtables/filters/crewofferfilter.tsx @@ -1,8 +1,7 @@ import React from 'react'; -import { Form, Dropdown, DropdownItemProps } from 'semantic-ui-react'; +import { Dropdown, DropdownItemProps, Form } from 'semantic-ui-react'; -import { IRosterCrew, ICrewFilter } from '../../../components/crewtables/model'; -import { printPortalStatus } from '../../../utils/crewutils'; +import { ICrewFilter, IRosterCrew } from '../../../components/crewtables/model'; import { GlobalContext } from '../../../context/globalcontext'; type CrewOfferFilterProps = { diff --git a/src/components/crewtables/filters/quipmenttools.tsx b/src/components/crewtables/filters/quipmenttools.tsx index aaec121b49..3175427e13 100644 --- a/src/components/crewtables/filters/quipmenttools.tsx +++ b/src/components/crewtables/filters/quipmenttools.tsx @@ -171,7 +171,7 @@ export const QuipmentToolsFilter = (props: QuipmentToolsFilterProps) => { gap: '0.5em', //color: green ? 'lightgreen' : undefined, gridArea: 'skill'}}> - {skills.map((skill) => )} + {skills.map((skill) => )}
}} diff --git a/src/components/crewtables/layers.tsx b/src/components/crewtables/layers.tsx index 3395650248..23763b6e11 100644 --- a/src/components/crewtables/layers.tsx +++ b/src/components/crewtables/layers.tsx @@ -4,26 +4,26 @@ export interface DataField { title?: string; description?: string; type?: 'string' | 'number' | 'custom'; - path?: string; + path?: string; provideValue?: (item: any) => any; } export interface FilterLayerProps { ChildComponent?: typeof React.Component & FilterLayer; - children?: JSX.Element; + children?: React.ReactNode; dataSource: any[]; fields: DataField[]; } - + export interface FilterLayerState { currentData: any[]; } - + export abstract class FilterLayer extends React.Component { protected inited = false; - + constructor(props: FilterLayerProps) { - super(props); + super(props); this.state = { currentData: [] } @@ -31,8 +31,8 @@ export abstract class FilterLayer extends React.Component {this.renderFilters()} {ChildComponent && } @@ -56,4 +56,4 @@ export abstract class FilterLayer extends React.Component); } } - + diff --git a/src/components/crewtables/rewards.tsx b/src/components/crewtables/rewards.tsx index c89d6dd7ec..b3bc96a7b1 100644 --- a/src/components/crewtables/rewards.tsx +++ b/src/components/crewtables/rewards.tsx @@ -142,7 +142,7 @@ export const RewardsGrid = (props: RewardsGridProps) => { altItems={items} targetGroup={(reward.type === 1 ? (crewTargetGroup ?? 'collectionsTarget') : (targetGroup ?? 'collectionsTarget_item'))} symbol={reward.symbol} - src={`${process.env.GATSBY_ASSETS_URL}${img}`} + src={`${process.env.REACT_ASSETS_URL}${img}`} quantity={reward.quantity} />
{(reward.quantity > 1 || !!needs?.length) && (
{quantityLabel(reward.quantity, negative, reward.owned)}
)}
@@ -183,7 +183,7 @@ export const RewardPicker = (props: RewardPickerProps) => { value: reward.symbol, text: arch?.name ?? reward.name, content: !icons ? undefined : (
- + {arch?.name ?? reward.full_name ?? reward.name}
) } diff --git a/src/components/crewtables/rosterpicker.tsx b/src/components/crewtables/rosterpicker.tsx index 565bc4432e..c8e9677d07 100644 --- a/src/components/crewtables/rosterpicker.tsx +++ b/src/components/crewtables/rosterpicker.tsx @@ -1,20 +1,20 @@ import React from 'react'; -import { Step, Icon, Label, Message } from 'semantic-ui-react'; +import { Icon, Label, Message, Step } from 'semantic-ui-react'; -import { PlayerCrew, CompactCrew, CompletionState, PlayerBuffMode, CryoCollection } from '../../model/player'; import { GlobalContext } from '../../context/globalcontext'; -import { oneCrewCopy, applyCrewBuffs, getSkills } from '../../utils/crewutils'; +import { CompactCrew, CompletionState, CryoCollection, PlayerBuffMode, PlayerCrew } from '../../model/player'; +import { applyCrewBuffs, getSkills, oneCrewCopy } from '../../utils/crewutils'; -import { IRosterCrew, RosterType } from './model'; +import { navigate } from '../../context/globalcontext'; import { CrewMember } from '../../model/crew'; -import { loadOfferCrew, loadOfferCrew2 } from '../../utils/offers'; -import { appelate } from '../../utils/misc'; import { OfferCrew } from '../../model/offers'; +import { appelate } from '../../utils/misc'; +import { loadOfferCrew2 } from '../../utils/offers'; import { useStateWithStorage } from '../../utils/storage'; import { AlertContext } from '../alerts/alertprovider'; -import { AvatarView } from '../item_presenters/avatarview'; import { CrewHoverStat } from '../hovering/crewhoverstat'; -import { navigate } from 'gatsby'; +import { AvatarView } from '../item_presenters/avatarview'; +import { IRosterCrew, RosterType } from './model'; type RosterPickerProps = { rosterType: RosterType; @@ -78,7 +78,7 @@ export const RosterPicker = (props: RosterPickerProps) => { }, [buffMode]); const hasBuyBack = !!playerData?.buyback_well?.length; - const steps = [] as JSX.Element[]; + const steps = [] as React.ReactNode[]; const buyFuses = getFusesInBuybackWell(); const buyUnowned = getUnownedInBuybackWell(); const buyWatched = getWatchedInBuybackWell(); @@ -94,7 +94,7 @@ export const RosterPicker = (props: RosterPickerProps) => { const offersJSX = ( setRosterType('offers')}> - + {t('pages.crew_view_modes.current_offers.name')} {rosterType === 'offers' && @@ -119,7 +119,7 @@ export const RosterPicker = (props: RosterPickerProps) => { if (hasBuyBack) { steps.push( setRosterType('buyBack')}> - + {t('pages.crew_view_modes.buyback_well.name')} {t('pages.crew_view_modes.buyback_well.description')} @@ -201,7 +201,7 @@ export const RosterPicker = (props: RosterPickerProps) => { ); - function drawAlert(crew: PlayerCrew, message: string | JSX.Element, idx: number, cols: CryoCollection[], icon: string, dismiss: (crew: PlayerCrew) => void) { + function drawAlert(crew: PlayerCrew, message: string | React.ReactNode, idx: number, cols: CryoCollection[], icon: string, dismiss: (crew: PlayerCrew) => void) { let one = false; if (cols.length) { for (let c of cols) { @@ -233,7 +233,7 @@ export const RosterPicker = (props: RosterPickerProps) => { targetGroup='alerts' />
- + { ); - function renderTrigger(): JSX.Element { + function renderTrigger(): React.ReactNode { return ( ))} diff --git a/src/components/errorboundary.tsx b/src/components/errorboundary.tsx index 39eec725a6..38f76554d6 100644 --- a/src/components/errorboundary.tsx +++ b/src/components/errorboundary.tsx @@ -1,7 +1,7 @@ import React, { Component } from 'react'; type ErrorBoundaryProps = { - children: JSX.Element; + children: React.ReactNode; }; type ErrorBoundaryState = { diff --git a/src/components/event_info_modal.tsx b/src/components/event_info_modal.tsx index c6eae621f4..054e91b4df 100644 --- a/src/components/event_info_modal.tsx +++ b/src/components/event_info_modal.tsx @@ -99,7 +99,7 @@ export function EventInfoModal(props: EventInfoModalProps) { return ( crew.base_skills[a].core > crew.base_skills[b].core ? -1 : 1) .map(skill => ({ key: skill, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/icon_${skill}.png` + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/icon_${skill}.png` })), traits: crew.traits.map(t => TRAIT_NAMES[t]), } as CrewCardBrief; diff --git a/src/components/event_info_tabs/leaderboard.tsx b/src/components/event_info_tabs/leaderboard.tsx index 1f50392056..a76caf1b4d 100644 --- a/src/components/event_info_tabs/leaderboard.tsx +++ b/src/components/event_info_tabs/leaderboard.tsx @@ -3,7 +3,7 @@ import { Message, Table } from 'semantic-ui-react'; import { getIconPath } from '../../utils/assets'; import { GlobalContext } from '../../context/globalcontext'; -import { glob } from 'fs'; + import { Leaderboard } from '../../model/events'; type LiveType = 'na' | 'live' | 'not_live'; @@ -62,7 +62,7 @@ function LeaderboardTab(props: { leaderboard: Leaderboard[], instanceId?: number
diff --git a/src/components/eventplanner/eventcrewtable.tsx b/src/components/eventplanner/eventcrewtable.tsx index bc0b51ca56..262308a5bf 100644 --- a/src/components/eventplanner/eventcrewtable.tsx +++ b/src/components/eventplanner/eventcrewtable.tsx @@ -1,28 +1,27 @@ import React from 'react'; -import { Header, Table, Icon, Rating, Form, Checkbox, Message, Popup } from 'semantic-ui-react'; -import { Link } from 'gatsby'; +import { Checkbox, Form, Header, Icon, Message, Popup, Rating, Table } from 'semantic-ui-react'; -import { InitialOptions, LockedProspect } from '../../model/game-elements'; import { GlobalContext } from '../../context/globalcontext'; +import { InitialOptions, LockedProspect } from '../../model/game-elements'; import { CrewHoverStat, CrewTarget } from '../../components/hovering/crewhoverstat'; import CONFIG from '../../components/CONFIG'; -import { SearchableTable, ITableConfigRow } from '../../components/searchabletable'; +import { ITableConfigRow, SearchableTable } from '../../components/searchabletable'; import { crewMatchesSearchFilter } from '../../utils/crewsearch'; -import { useStateWithStorage } from '../../utils/storage'; import { crewGender, isQuipped, qbitsToSlots } from '../../utils/crewutils'; +import { useStateWithStorage } from '../../utils/storage'; -import { IEventData, IRosterCrew, IEventScoredCrew, IEventCombos, IBestCombos, IBestCombo } from './model'; +import { Link } from 'react-router-dom'; import { calculateGalaxyChance, computeEventBest } from '../../utils/events'; import { navToCrewPage } from '../../utils/nav'; -import { DEFAULT_MOBILE_WIDTH } from '../hovering/hoverstat'; import { SkillPicker } from '../base/skillpicker'; -import { QPContext } from '../qpconfig/provider'; +import { CrewShipCells, getShipTableConfig } from '../crewtables/views/shipabilities'; +import { DEFAULT_MOBILE_WIDTH } from '../hovering/hoverstat'; import { QuipmentProspectsOptions } from '../qpconfig/options'; +import { QPContext } from '../qpconfig/provider'; import { OptionsPanelFlexRow } from '../stats/utils'; -import { CrewShipCells, getShipTableConfig } from '../crewtables/views/shipabilities'; -import { QuipmentProspectAccordion, QuipmentProspectList } from '../voyagecalculator/quipment/quipmentprospects'; +import { IBestCombo, IBestCombos, IEventCombos, IEventData, IEventScoredCrew, IRosterCrew } from './model'; type EventCrewTableProps = { rosterType: string; @@ -161,7 +160,7 @@ export const EventCrewTable = (props: EventCrewTableProps) => { > {eventData.activeContent?.primary_skill === skill.name && } {eventData.activeContent?.secondary_skill === skill.name && } - {CONFIG.SKILLS[skill.name]} + {CONFIG.SKILLS[skill.name]} , reverse: true, customCompare: @@ -191,8 +190,8 @@ export const EventCrewTable = (props: EventCrewTableProps) => { column: customColumn, title: - Skill - +Skill + Skill + +Skill , reverse: true }); @@ -321,7 +320,7 @@ export const EventCrewTable = (props: EventCrewTableProps) => { ); - function renderTableRow(crew: IEventScoredCrew, idx: number, highlighted: boolean): JSX.Element { + function renderTableRow(crew: IEventScoredCrew, idx: number, highlighted: boolean): React.ReactNode { const attributes = { positive: highlighted }; @@ -339,7 +338,7 @@ export const EventCrewTable = (props: EventCrewTableProps) => { >
- + {crew.statusIcon && }
@@ -360,13 +359,13 @@ export const EventCrewTable = (props: EventCrewTableProps) => { {scoreLabel(crew.bestSkill.score)} -
Skill +
Skill {eventData.activeContent?.content_type !== 'voyage' && {!!crew.bestPair.score && <> {scoreLabel(crew.bestPair.score)} -
Skill - {crew.bestPair.skillB !== '' && (+Skill)} +
Skill + {crew.bestPair.skillB !== '' && (+Skill)} } } {eventData.activeContent?.content_type === 'voyage' && (<> @@ -423,7 +422,7 @@ export const EventCrewTable = (props: EventCrewTableProps) => { function printExtraGauntlet(crew: IEventScoredCrew) { let granks = Object.entries(crew.ranks).filter(([key, value]) => key.slice(0, 2) === 'G_'); - let strs = [] as React.JSX.Element[]; + let strs = [] as React.ReactNode[]; granks.sort((a, b) => a[1] - b[1] || a[0].localeCompare(b[0])); for (let rank of granks) { if (rank[1] <= 25) { @@ -432,10 +431,10 @@ export const EventCrewTable = (props: EventCrewTableProps) => { } } if (!strs.length) return <>; - else return strs.reduce((p, n) => (p !== undefined ? <>{p}
{n} : n) as React.JSX.Element, undefined as React.JSX.Element | undefined) || <>; + else return strs.reduce((p, n) => (p !== undefined ? <>{p}
{n} : n) as React.ReactNode, undefined as React.ReactNode | undefined) || <>; } - function descriptionLabel(crew: IEventScoredCrew, withActiveStatus = false): JSX.Element { + function descriptionLabel(crew: IEventScoredCrew, withActiveStatus = false): React.ReactNode { return (
@@ -454,18 +453,18 @@ export const EventCrewTable = (props: EventCrewTableProps) => { ); } - function renderCustomLabel(crew: IEventScoredCrew, customColumn: string): JSX.Element { + function renderCustomLabel(crew: IEventScoredCrew, customColumn: string): React.ReactNode { const combo = customColumn.split('.')[1]; return <>{scoreLabel(crew.combos[combo])}; } - function scoreLabel(score: number): JSX.Element { + function scoreLabel(score: number): React.ReactNode { if (!score || score === 0) return (<>); if (phaseType === 'gather') return (<>{`${calculateGalaxyChance(score)}%`}); return (<>{Math.floor(score)}); } - function renderSkillScore(crew: IEventScoredCrew, skill: string): JSX.Element { + function renderSkillScore(crew: IEventScoredCrew, skill: string): React.ReactNode { if (phaseType === 'voyage') { return ( @@ -540,7 +539,7 @@ const EventCrewMatrix = (props: EventCrewMatrixProps) => { {matrixSkills.map((skill, cellId) => ( - {`${skill.name}`} + {`${skill.name}`} ))} @@ -548,7 +547,7 @@ const EventCrewMatrix = (props: EventCrewMatrixProps) => { {CONFIG.SKILLS_SHORT.map((skillA, rowId) => ( - {`${skillA.name}`} + {`${skillA.name}`} {matrixSkills.map((skillB, cellId) => { let cbkey = [skillA.name, skillB.name].sort().join(""); let cbs = comboSeen[cbkey]; @@ -595,9 +594,9 @@ const EventCrewMatrix = (props: EventCrewMatrixProps) => { justifyContent: 'center', gap: '0.5em' }}> - {`${skillA.name}`} + {`${skillA.name}`}  /  - {`${skillB.name}`} + {`${skillB.name}`}
{renderCell(skillA.name, skillB.name, cbs || !vis, isMobile)}
; @@ -611,7 +610,7 @@ const EventCrewMatrix = (props: EventCrewMatrixProps) => { } - function renderCell(skillA: string, skillB: string, invisible: boolean, mobile: boolean) : JSX.Element { + function renderCell(skillA: string, skillB: string, invisible: boolean, mobile: boolean) : React.ReactNode { let key: string, best: IBestCombo; if (skillA === skillB) { key = skillA; @@ -633,14 +632,14 @@ const EventCrewMatrix = (props: EventCrewMatrixProps) => { if (!isMobile) return ( handleClick(skillA, skillB)}> - +
{icon} {bestCrew?.name} ({phaseType === 'gather' ? `${calculateGalaxyChance(best.score)}%` : Math.floor(best.score)}) ); else return (
handleClick(skillA, skillB)}> - +
{icon} {bestCrew?.name} ({phaseType === 'gather' ? `${calculateGalaxyChance(best.score)}%` : Math.floor(best.score)})
); diff --git a/src/components/eventplanner/eventpicker.tsx b/src/components/eventplanner/eventpicker.tsx index d620f08e58..577d17a603 100644 --- a/src/components/eventplanner/eventpicker.tsx +++ b/src/components/eventplanner/eventpicker.tsx @@ -12,20 +12,19 @@ import ProspectPicker from '../../components/prospectpicker'; import { EventShuttleHelper, ShuttleHelper } from '../../components/shuttlehelper/shuttlehelper'; import CONFIG from '../../components/CONFIG'; -import { applyCrewBuffs, applySkillBuff, crewCopy, oneCrewCopy } from '../../utils/crewutils'; +import { applyCrewBuffs, applySkillBuff, oneCrewCopy } from '../../utils/crewutils'; import { useStateWithStorage } from '../../utils/storage'; +import { factionImageLocations } from '../factions'; import { GatherPlanner } from '../gather/gather_planner'; +import { CrewHoverStat } from '../hovering/crewhoverstat'; import { ShipHoverStat } from '../hovering/shiphoverstat'; import { AvatarView } from '../item_presenters/avatarview'; import { QPContext } from '../qpconfig/provider'; import { ShipTable } from '../ship/shiptable'; import { SpecialistMissionTable } from '../specialist/specialistmissions'; +import { OptionsPanelFlexRow } from '../stats/utils'; import { IEventData, IRosterCrew } from './model'; -import { CrewHoverStat } from '../hovering/crewhoverstat'; -import { CrewPresenter } from '../item_presenters/crew_presenter'; -import { factionImageLocations } from '../factions'; -import { OptionsPanelFlexColumn, OptionsPanelFlexRow } from '../stats/utils'; interface ISelectOptions { key: string; @@ -171,7 +170,7 @@ export const EventPicker = (props: EventPickerProps) => { onChange={(e, { value }) => setEventIndex(value as number)} /> - +
{eventData.description}
{phaseList.length > 1 && (
@@ -375,7 +374,7 @@ export const EventFactions = (props: FeatureToolProps & { vertical?: boolean, im {facts.map(faction => { if (!faction) return <>; return (
- +
{faction.name}
) })} diff --git a/src/components/excluder/crewexcluder.tsx b/src/components/excluder/crewexcluder.tsx index e0a88b6765..7a25b93f4c 100644 --- a/src/components/excluder/crewexcluder.tsx +++ b/src/components/excluder/crewexcluder.tsx @@ -365,7 +365,7 @@ export const CrewExcluder = (props: CrewExcluderProps) => { return excludedCrewIds.filter(f => quipped.includes(f)); } - function renderExcludedCrew(): JSX.Element { + function renderExcludedCrew(): React.ReactNode { const visibleExcludedCrew = [] as IVoyageCrew[]; excludedCrewIds.forEach(crewId => { const crew = props.preExcludedCrew.find(crew => crew.id === crewId); @@ -427,10 +427,10 @@ export const CrewExcluder = (props: CrewExcluderProps) => { ) } - function renderCrewLabel(crew: IVoyageCrew): JSX.Element { + function renderCrewLabel(crew: IVoyageCrew): React.ReactNode { return (
@@ -353,7 +353,7 @@ export const HofDetails = (props: HofDetailsProps) => { alignItems: "center" }} key={`voycountseat_${seat}_${featured.symbol}`}> - +
{appelate(seat)}
{Math.round(100 * (count / rawVoyages.length))}%
@@ -537,7 +537,7 @@ export const HofDetails = (props: HofDetailsProps) => { size={64} rarity={crew.max_rarity} maxRarity={crew.max_rarity} - src={`${process.env.GATSBY_ASSETS_URL}${crew.imageUrlPortrait}`} + src={`${process.env.REACT_ASSETS_URL}${crew.imageUrlPortrait}`} targetGroup={"voyagehof"} />
diff --git a/src/components/hof/periodstats.tsx b/src/components/hof/periodstats.tsx index 258a9838fe..6137531272 100644 --- a/src/components/hof/periodstats.tsx +++ b/src/components/hof/periodstats.tsx @@ -230,7 +230,7 @@ export const VoyageStatsForPeriod = ({ period, stats, allCrew, rankBy, clickCrew {/* */}
@@ -265,7 +265,7 @@ export const VoyageStatsForPeriod = ({ period, stats, allCrew, rankBy, clickCrew return (
-
{Math.round(100 * (seat.crewCount / crew.crewCount))}%
@@ -277,7 +277,7 @@ export const VoyageStatsForPeriod = ({ period, stats, allCrew, rankBy, clickCrew const quip = context.core.items.find(f => f.kwipment_id === key); return
- {!!quip && <> + {!!quip && <> {quip.name} - {value.toLocaleString()} } @@ -292,7 +292,7 @@ export const VoyageStatsForPeriod = ({ period, stats, allCrew, rankBy, clickCrew let equipment = value.equipment; return
{equipment && { return; } - fetch(`${process.env.GATSBY_DATACORE_URL}api/voyagesByCrew?opand=1&crew=${crew.join(",")}&days=${this.state.glanceDays}`) + fetch(`${process.env.REACT_DATACORE_URL}api/voyagesByCrew?opand=1&crew=${crew.join(",")}&days=${this.state.glanceDays}`) .then((response) => response.json()) .then((rawVoyages: RawVoyageRecord[]) => { let codict = {} as { [key: string]: RawVoyageRecord } @@ -148,7 +148,7 @@ class VoyageHOF extends Component { } componentDidMount() { - fetch(`${process.env.GATSBY_DATACORE_URL}api/telemetry?type=voyage`) + fetch(`${process.env.REACT_DATACORE_URL}api/telemetry?type=voyage`) .then((response) => response.json()) .then((voyageStats) => { const isMobile = typeof window !== 'undefined' && window.innerWidth < DEFAULT_MOBILE_WIDTH; diff --git a/src/components/hovering/crewhoverstat.tsx b/src/components/hovering/crewhoverstat.tsx index 0dd5856a0a..0909d44177 100644 --- a/src/components/hovering/crewhoverstat.tsx +++ b/src/components/hovering/crewhoverstat.tsx @@ -160,7 +160,7 @@ export class CrewTarget extends HoverStatTarget('displayItem', undefined); if (di) { - const url = `${process.env.GATSBY_ASSETS_URL}${di.imageUrlFullBody}`; + const url = `${process.env.REACT_ASSETS_URL}${di.imageUrlFullBody}`; toDataURL(url, () => {}); } } @@ -168,7 +168,7 @@ export class CrewTarget extends HoverStatTarget { const img = new Image() img.src = url; @@ -290,7 +290,7 @@ export class CrewHoverStat extends HoverStat { + protected renderContent = (): React.ReactNode => { if (this.checkBorder()) { if (isWindow) window.setTimeout(() => this.checkBorder(undefined, true)); } diff --git a/src/components/hovering/hoverstat.tsx b/src/components/hovering/hoverstat.tsx index a93d5629c7..24153d3f23 100644 --- a/src/components/hovering/hoverstat.tsx +++ b/src/components/hovering/hoverstat.tsx @@ -54,7 +54,7 @@ export interface HoverStatTargetProps { /** * The wrapped content */ - children: JSX.Element; + children: React.ReactNode; /** * The target group (required to bind) @@ -190,7 +190,7 @@ export abstract class HoverStat { for (let i = 0; i < 1; i++) { let img = new Image(); @@ -130,7 +130,7 @@ export class ItemHoverStat extends HoverStat { + protected renderContent = (): React.ReactNode => { if (this.checkBorder()) { window.setTimeout(() => this.checkBorder(undefined, true)); } diff --git a/src/components/hovering/shiphoverstat.tsx b/src/components/hovering/shiphoverstat.tsx index 2d0471784b..27778dc227 100644 --- a/src/components/hovering/shiphoverstat.tsx +++ b/src/components/hovering/shiphoverstat.tsx @@ -100,7 +100,7 @@ export class ShipTarget extends HoverStatTarget { for (let i = 0; i < 1; i++) { let img = new Image(); @@ -167,7 +167,7 @@ export class ShipHoverStat extends HoverStat('ship', value, true); } - protected renderContent = (): JSX.Element => { + protected renderContent = (): React.ReactNode => { if (this.checkBorder()) { window.setTimeout(() => this.checkBorder(undefined, true)); } diff --git a/src/components/item_presenters/avatarview.tsx b/src/components/item_presenters/avatarview.tsx index e2b6cc7d91..0b9dcb3612 100644 --- a/src/components/item_presenters/avatarview.tsx +++ b/src/components/item_presenters/avatarview.tsx @@ -116,8 +116,8 @@ export const AvatarView = (props: AvatarViewProps) => { let starSize = Math.floor(size / 6); let bottomStar = Math.floor(size / 23); let borderRadius = props.round ? Math.floor(size / 2) : Math.floor(size / 7); - let star_reward = `${process.env.GATSBY_ASSETS_URL}atlas/star_reward.png`; - let star_reward_inactive = `${process.env.GATSBY_ASSETS_URL}atlas/star_reward_inactive.png`; + let star_reward = `${process.env.REACT_ASSETS_URL}atlas/star_reward.png`; + let star_reward_inactive = `${process.env.REACT_ASSETS_URL}atlas/star_reward_inactive.png`; let item = undefined as EquipmentItem | undefined; let ship = undefined as Ship | undefined; let HoverTarget = undefined as any | undefined; @@ -134,7 +134,7 @@ export const AvatarView = (props: AvatarViewProps) => { } as React.CSSProperties; let src = props.src; - let rarity = [] as JSX.Element[]; + let rarity = [] as React.ReactNode[]; if (mode === 'crew') { gen_item = prepareCrew(gen_item); @@ -249,7 +249,7 @@ export const AvatarView = (props: AvatarViewProps) => { HoverTarget = CrewTarget; const crew = gen_item as PlayerCrew; if (!crew.rarity && !!crew.highest_owned_rarity) crew.rarity = crew.highest_owned_rarity!; - if (!src) src= `${process.env.GATSBY_ASSETS_URL}${crew.imageUrlPortrait}`; + if (!src) src= `${process.env.REACT_ASSETS_URL}${crew.imageUrlPortrait}`; if (!playerData) { crew.immortal = CompletionState.DisplayAsImmortalUnowned; crew.rarity = crew.max_rarity; @@ -257,10 +257,10 @@ export const AvatarView = (props: AvatarViewProps) => { if ((showMaxRarity || crew.immortal) && crewBackground === 'rich') { let kwip = substitute_kwipment ?? crew.kwipment; if (kwip?.length === 4 && kwip?.every((qs) => typeof qs === 'number' ? !!qs : !!qs[1])) { - imgStyle.backgroundImage = `url(${process.env.GATSBY_ASSETS_URL}collection_vault_vault_item_bg_postimmortalized_256.png)`; + imgStyle.backgroundImage = `url(${process.env.REACT_ASSETS_URL}collection_vault_vault_item_bg_postimmortalized_256.png)`; } else { - imgStyle.backgroundImage = `url(${process.env.GATSBY_ASSETS_URL}collection_vault_vault_item_bg_immortalized_256.png)`; + imgStyle.backgroundImage = `url(${process.env.REACT_ASSETS_URL}collection_vault_vault_item_bg_immortalized_256.png)`; } imgStyle.backgroundSize = (size) + "px"; imgStyle.backgroundRepeat = "no-repeat"; @@ -314,10 +314,10 @@ export const AvatarView = (props: AvatarViewProps) => { item.demandCrew = citem.demandCrew; if (!src) { if (item.imageUrl) { - src = `${process.env.GATSBY_ASSETS_URL}${item.imageUrl}`; + src = `${process.env.REACT_ASSETS_URL}${item.imageUrl}`; } else if (item.icon) { - src = `${process.env.GATSBY_ASSETS_URL}${getIconPath(item.icon, true)}`; + src = `${process.env.REACT_ASSETS_URL}${getIconPath(item.icon, true)}`; } } @@ -326,7 +326,7 @@ export const AvatarView = (props: AvatarViewProps) => { item = { ...item, ... globalContext.localized.ITEM_ARCHETYPES[item.symbol] }; } if (item && gen_item.rarity) item.rarity = gen_item.rarity; - if (item && !src) src = `${process.env.GATSBY_ASSETS_URL}${item.imageUrl}`; + if (item && !src) src = `${process.env.REACT_ASSETS_URL}${item.imageUrl}`; gen_item = item; if (gen_item && !gen_item.max_rarity) { gen_item.max_rarity = gen_item.rarity; @@ -374,10 +374,10 @@ export const AvatarView = (props: AvatarViewProps) => { } if (props.useSchematicsIcon && cship) { - if (!src) src = `${process.env.GATSBY_ASSETS_URL}${cship.icon?.file.slice(1).replace('/', '_')}.png`; + if (!src) src = `${process.env.REACT_ASSETS_URL}${cship.icon?.file.slice(1).replace('/', '_')}.png`; } else if (ship) { - if (!src) src = `${process.env.GATSBY_ASSETS_URL}${ship.icon?.file.slice(1).replace('/', '_')}.png`; + if (!src) src = `${process.env.REACT_ASSETS_URL}${ship.icon?.file.slice(1).replace('/', '_')}.png`; } gen_item = ship; if (gen_item && !gen_item.max_rarity) { diff --git a/src/components/item_presenters/classic_presenter.tsx b/src/components/item_presenters/classic_presenter.tsx index ff1b2411dc..fe0e5fbecc 100644 --- a/src/components/item_presenters/classic_presenter.tsx +++ b/src/components/item_presenters/classic_presenter.tsx @@ -52,7 +52,7 @@ const defaultFields = [ export interface IFieldOverride { field: ValidField; - override: (crew: CrewMember, compact?: boolean) => JSX.Element; + override: (crew: CrewMember, compact?: boolean) => React.ReactNode; }; export interface IFieldScale { @@ -78,7 +78,7 @@ export const ClassicPresenter = (props: ClassicPresenterProps) => { const myCrew = playerData ? playerData.player.character.crew : undefined; const fields = props.fields ?? defaultFields; - const elements = [] as JSX.Element[]; + const elements = [] as React.ReactNode[]; if (!crew.cap_achiever && myCrew) { let fc = myCrew.find(f => f.symbol === crew.symbol); if (fc?.cap_achiever) { @@ -185,12 +185,12 @@ const CrewDemands = (props: { crew: CrewMember }) => { n: {crewDemands.factionOnlyTotal} })} - + {' '} {crewDemands.totalChronCost} {', '} - + {' '} {crewDemands.craftCost}
@@ -432,7 +432,7 @@ export const Fuses = (props: { crew: CrewMember, compact?: boolean }) => { ); - function renderTableHeader(): JSX.Element { + function renderTableHeader(): React.ReactNode { const baseSkills = Object.entries(crew.base_skills) .filter(skill => !!skill[1]) .sort((a, b) => b[1].core - a[1].core); @@ -442,7 +442,7 @@ export const Fuses = (props: { crew: CrewMember, compact?: boolean }) => { {baseSkills.map(skill => - + )} @@ -450,11 +450,11 @@ export const Fuses = (props: { crew: CrewMember, compact?: boolean }) => { ) } - function renderSkillData(sk: SkillData): JSX.Element { + function renderSkillData(sk: SkillData): React.ReactNode { return renderTableRow(sk.rarity, sk.base_skills); } - function renderTableRow(rarity: number, skills: BaseSkills): JSX.Element { + function renderTableRow(rarity: number, skills: BaseSkills): React.ReactNode { debasedCrew.base_skills = skills; Object.keys(debasedCrew.base_skills).map(skill => { if (!debasedCrew.base_skills[skill]) diff --git a/src/components/item_presenters/crew_items.tsx b/src/components/item_presenters/crew_items.tsx index 9a9ce5c054..0419755794 100644 --- a/src/components/item_presenters/crew_items.tsx +++ b/src/components/item_presenters/crew_items.tsx @@ -21,7 +21,7 @@ export interface CrewItemsViewProps { itemSize?: number; mobileSize?: number; quipment?: boolean; - printNA?: string | JSX.Element; + printNA?: string | React.ReactNode; targetGroup?: string; locked?: boolean; vertical?: boolean; @@ -249,7 +249,7 @@ export const CrewItemsView = (props: CrewItemsViewProps) => { export interface CrewItemDisplayProps extends CrewItemsViewProps { equipment?: EquipmentItem; - expiration?: string | JSX.Element; + expiration?: string | React.ReactNode; vertical: boolean; itemSize?: number; mobileSize?: number; @@ -287,12 +287,12 @@ export const CrewItemDisplay = (props: CrewItemDisplayProps) => { itemSymbol={equipment?.symbol} allItems={globalContext.core.items} playerData={globalContext.player.playerData} - src={`${process.env.GATSBY_ASSETS_URL}${equipment?.imageUrl ?? "items_equipment_box02_icon.png"}`} + src={`${process.env.REACT_ASSETS_URL}${equipment?.imageUrl ?? "items_equipment_box02_icon.png"}`} size={itemSize} maxRarity={equipment?.rarity ?? 0} rarity={equipment?.rarity ?? 0} /> - {locked && } + {locked && }
) diff --git a/src/components/item_presenters/crew_presenter.tsx b/src/components/item_presenters/crew_presenter.tsx index 1bfc4f814c..fc688dfdb2 100644 --- a/src/components/item_presenters/crew_presenter.tsx +++ b/src/components/item_presenters/crew_presenter.tsx @@ -324,7 +324,7 @@ export class CrewPresenter extends React.Component< return newcrew ?? (inputCrew as PlayerCrew); } - render(): JSX.Element { + render(): React.ReactNode { const { crew: inputCrew, touched, @@ -436,7 +436,7 @@ export class CrewPresenter extends React.Component< > {!showPortrait && ( { ); - function renderOtherRanks(): JSX.Element { - let v = [] as JSX.Element[]; - let g = [] as JSX.Element[]; - let b = [] as JSX.Element[]; - let o = [] as JSX.Element[]; + function renderOtherRanks(): React.ReactNode { + let v = [] as React.ReactNode[]; + let g = [] as React.ReactNode[]; + let b = [] as React.ReactNode[]; + let o = [] as React.ReactNode[]; const isMobile = typeof window !== 'undefined' && window.innerWidth <= DEFAULT_MOBILE_WIDTH; const widths: SemanticWIDTHS = isMobile ? 'two' : 'three'; @@ -207,7 +207,7 @@ export const CrewRanks = (props: CrewRanksProps) => { : crew.ranks[rank].rank; const formatLabel = (label: string) => { - let output: string | JSX.Element = ''; + let output: string | React.ReactNode = ''; if (label.length > 15) { output = label.split(' ').reduce((p, n) => p ? <>{p} {n} : <>{n}, <>) } diff --git a/src/components/item_presenters/crewstat.tsx b/src/components/item_presenters/crewstat.tsx index b76af9e4aa..393c602eaf 100644 --- a/src/components/item_presenters/crewstat.tsx +++ b/src/components/item_presenters/crewstat.tsx @@ -39,7 +39,7 @@ class CrewStat extends PureComponent { ...this.props.gridStyle }}>
- +
{!!stats && ( @@ -60,7 +60,7 @@ class CrewStat extends PureComponent { } {!!quipmentMode &&
- + {stats.core! + stats.range_min!}-{stats.core! + stats.range_max!} diff --git a/src/components/item_presenters/gauntletskill.tsx b/src/components/item_presenters/gauntletskill.tsx index cbc3b3bdfe..65a6e59a1a 100644 --- a/src/components/item_presenters/gauntletskill.tsx +++ b/src/components/item_presenters/gauntletskill.tsx @@ -77,7 +77,7 @@ export class GauntletSkill extends PresenterPlugin
{crew.base_skills[node.contest_data?.featured_skill ?? "_invalid"] ? - + : ''}
) @@ -133,8 +133,8 @@ export class GauntletSkill extends PresenterPlugin {this.drawLeftArea()}
- - + +
{t('base.best_pair')}
diff --git a/src/components/item_presenters/item_presenter.tsx b/src/components/item_presenters/item_presenter.tsx index aa1802af02..744c258508 100644 --- a/src/components/item_presenters/item_presenter.tsx +++ b/src/components/item_presenters/item_presenter.tsx @@ -92,7 +92,7 @@ export function renderBonuses(skills: { [key: string]: Skill & { disabled?: bool }} >
- +

+{skill.core ?? 0} +({skill.range_min ?? 0}-{skill.range_max ?? 0})

{atext}

@@ -143,7 +143,7 @@ export class ItemPresenter extends Component
navClick(e, ingitem)} style={{ cursor: "pointer" }} title={ingitem.name}> { key: T; value: T; text?: string; - content?: JSX.Element; + content?: React.ReactNode; } export interface BuffSelectorProps { @@ -169,7 +169,7 @@ export function drawBuff( key: string | number, data: PlayerBuffMode, buffClick?: (value: PlayerBuffMode) => void -): JSX.Element { +): React.ReactNode { const buffclick = ( e: React.MouseEvent, buff: PlayerBuffMode @@ -247,7 +247,7 @@ export function drawImmo( immoed?: boolean, prospect?: boolean, gender?: "m" | "f" | "" -): JSX.Element { +): React.ReactNode { const immoclick = ( e: React.MouseEvent, immo: PlayerImmortalMode diff --git a/src/components/item_presenters/ship_presenter.tsx b/src/components/item_presenters/ship_presenter.tsx index dee175029b..9b6bbbf87a 100644 --- a/src/components/item_presenters/ship_presenter.tsx +++ b/src/components/item_presenters/ship_presenter.tsx @@ -73,7 +73,7 @@ export class ShipPresenter extends Component('ship', value, true); } - render(): JSX.Element { + render(): React.ReactNode { const { ship: ship, touched, tabs, showIcon } = this.props; const { mobileWidth } = this.state; const { SHIP_TRAIT_NAMES } = this.context.localized; @@ -155,7 +155,7 @@ export class ShipPresenter extends Component
@@ -169,7 +169,7 @@ export class ShipPresenter extends Component + src={`${process.env.REACT_ASSETS_URL}atlas/icon_${bs.skill}.png`} /> })} {/* {(!this.props.disableBuffs) && buffToggle(e)} /> diff --git a/src/components/item_presenters/shipskill.tsx b/src/components/item_presenters/shipskill.tsx index b75cdd655a..907a9ef032 100644 --- a/src/components/item_presenters/shipskill.tsx +++ b/src/components/item_presenters/shipskill.tsx @@ -107,8 +107,8 @@ export class ShipSkill extends PresenterPlugin { - let elems: JSX.Element[] = []; + const drawBullets = (actions: number): React.ReactNode[] => { + let elems: React.ReactNode[] = []; for (let i = 0; i < actions; i++) { elems.push(
diff --git a/src/components/itemdisplay.tsx b/src/components/itemdisplay.tsx index 566e2301d2..39fca4b88b 100644 --- a/src/components/itemdisplay.tsx +++ b/src/components/itemdisplay.tsx @@ -36,10 +36,10 @@ class ItemDisplay extends PureComponent { let borderRadius = Math.floor(this.props.size / 7); let borderColor = CONFIG.RARITIES[this.props.maxRarity ?? 0].color; - let star_reward = `${process.env.GATSBY_ASSETS_URL}atlas/star_reward.png`; - let star_reward_inactive = `${process.env.GATSBY_ASSETS_URL}atlas/star_reward_inactive.png`; + let star_reward = `${process.env.REACT_ASSETS_URL}atlas/star_reward.png`; + let star_reward_inactive = `${process.env.REACT_ASSETS_URL}atlas/star_reward_inactive.png`; - let rarity = [] as JSX.Element[]; + let rarity = [] as React.ReactNode[]; if (!this.props.hideRarity) { for (let i = 0; i < this.props.rarity; i++) { rarity.push(); @@ -90,10 +90,10 @@ class ItemDisplay extends PureComponent { else if (crew.immortal && crewBackground === 'rich') { let kwip = this.props.substitute_kwipment ?? crew.kwipment; if (kwip?.length === 4 && kwip?.every((qs) => typeof qs === 'number' ? !!qs : !!qs[1])) { - imgStyle.backgroundImage = `url(${process.env.GATSBY_ASSETS_URL}collection_vault_vault_item_bg_postimmortalized_256.png)`; + imgStyle.backgroundImage = `url(${process.env.REACT_ASSETS_URL}collection_vault_vault_item_bg_postimmortalized_256.png)`; } else { - imgStyle.backgroundImage = `url(${process.env.GATSBY_ASSETS_URL}collection_vault_vault_item_bg_immortalized_256.png)`; + imgStyle.backgroundImage = `url(${process.env.REACT_ASSETS_URL}collection_vault_vault_item_bg_immortalized_256.png)`; } imgStyle.backgroundSize = (this.props.size) + "px"; imgStyle.backgroundRepeat = "no-repeat"; diff --git a/src/components/items/farmtable.tsx b/src/components/items/farmtable.tsx index 9a6309f155..b10507e5ef 100644 --- a/src/components/items/farmtable.tsx +++ b/src/components/items/farmtable.tsx @@ -30,7 +30,7 @@ export interface FarmTableProps { excludedSourceTypes?: number[]; textStyle?: React.CSSProperties; eventData?: IEventData; - renderExpanded?: (row: FarmSources) => JSX.Element; + renderExpanded?: (row: FarmSources) => React.ReactNode; } export const FarmTable = (props: FarmTableProps) => { @@ -78,7 +78,7 @@ export const FarmTable = (props: FarmTableProps) => { const flexRow = OptionsPanelFlexRow; const eps = React.useMemo(() => { - let res = [] as JSX.Element[]; + let res = [] as React.ReactNode[]; let eps = {} as {[key:string]: string}; if (episodes) { @@ -309,7 +309,7 @@ export const FarmTable = (props: FarmTableProps) => { }}> { value: `${item.symbol}`, text: `${item.rarity}* ${item.name}`, content: icons ? (
- + {`${item.rarity}* ${item.name}`}
) : undefined }); diff --git a/src/components/items/quipmentfilters.tsx b/src/components/items/quipmentfilters.tsx index ad8c615efe..28738f7e0d 100644 --- a/src/components/items/quipmentfilters.tsx +++ b/src/components/items/quipmentfilters.tsx @@ -69,7 +69,7 @@ export interface QuipmentFilterProps { mode: QuipmentMode; setMode: (value: QuipmentMode) => void; initCrew?: CrewMember; - children: JSX.Element; + children: React.ReactNode; noRender?: boolean; } @@ -476,7 +476,7 @@ export const QuipmentFilterProvider = (props: QuipmentFilterProps) => { function renderItem(item: IEssentialData, isSelected: boolean) { let crew = item as CrewMember | PlayerCrew; return
- {crew.name} diff --git a/src/components/items/utils.tsx b/src/components/items/utils.tsx index ca559b2a21..83249247ea 100644 --- a/src/components/items/utils.tsx +++ b/src/components/items/utils.tsx @@ -11,7 +11,7 @@ import { SemanticWIDTHS } from 'semantic-ui-react'; export interface CustomFieldDef { field: string; text: string; - format?: (value: any, context: any) => string | React.JSX.Element; + format?: (value: any, context: any) => string | React.ReactNode; width?: SemanticWIDTHS; reverse?: boolean, customCompare?: (a: any, b: any) => number; @@ -89,7 +89,7 @@ export function printRequiredTraits( item: EquipmentItem, trait_names: { [key: string]: string }, t?: TranslateMethod -): JSX.Element { +): React.ReactNode { if (item.kwipment) { if (item.traits_requirement?.length) { let req = item.traits_requirement!; @@ -150,7 +150,7 @@ export interface FlavorConfig { export function createFlavor(item: EquipmentItem | EquipmentItem | PlayerEquipmentItem, config: FlavorConfig) { const { localized, crew: inputCrew } = config; const { t, tfmt } = localized; - let output = [] as JSX.Element[]; + let output = [] as React.ReactNode[]; let flavor = item.flavor ?? ""; if (flavor.startsWith("Equippable by:")) { diff --git a/src/components/itemsources.tsx b/src/components/itemsources.tsx index 40b2985cab..96e3bde4fa 100644 --- a/src/components/itemsources.tsx +++ b/src/components/itemsources.tsx @@ -80,8 +80,8 @@ class ItemSources extends PureComponent { const briefSepInit = <> ; const briefSepFinal = <>
; const textDec = ""; - let res = [] as JSX.Element[]; - let eps = {} as {[key:string]: JSX.Element}; + let res = [] as React.ReactNode[]; + let eps = {} as {[key:string]: React.ReactNode}; if (this.context.core.episodes) { this.context.core.episodes.forEach(e => { diff --git a/src/components/missioncost.tsx b/src/components/missioncost.tsx index 0756061cc0..47c2cfd874 100644 --- a/src/components/missioncost.tsx +++ b/src/components/missioncost.tsx @@ -8,7 +8,7 @@ type MissionCostProps = { avg_cost?: number; mastery: number; chance_grade: number; - name: string | JSX.Element; + name: string | React.ReactNode; cadet?: boolean; continuum?: boolean; hideCost?: boolean; @@ -25,15 +25,15 @@ class MissionCost extends PureComponent { {this.props.name}{' '} - + {is_known && !this.props.hideCost && ( {' ('} - {!cadet && !continuum && } - {!!cadet && } - {!!continuum && } + {!cadet && !continuum && } + {!!cadet && } + {!!continuum && } {` ${this.props.cost}${has_avg ? `; avg. ${this.props.avg_cost?.toFixed(2)}` : ''})`} diff --git a/src/components/missions/challenge_node.tsx b/src/components/missions/challenge_node.tsx index 364e8e65fe..3ff23959e8 100644 --- a/src/components/missions/challenge_node.tsx +++ b/src/components/missions/challenge_node.tsx @@ -93,7 +93,7 @@ export const ChallengeNode = (props: ChallengeNodeProps) => { return
{localized.TRAIT_NAMES[t.trait]} (+{t.bonuses[mastery]}) })} } - + {!!rewards &&
{claimed &&
(Claimed)
} diff --git a/src/components/missions/continuum_helper.tsx b/src/components/missions/continuum_helper.tsx index 2fe1ef7c80..54e254cad7 100644 --- a/src/components/missions/continuum_helper.tsx +++ b/src/components/missions/continuum_helper.tsx @@ -608,7 +608,7 @@ export const ContinuumComponent = (props: ContinuumComponentProps) => { > { size="large" /> {(config.ignoreChallenges?.includes(challenge.id) && ( @@ -161,7 +161,7 @@ export const PathCrewDisplay = (props: PathCrewDisplayProps) => { itemSymbol={c.symbol} playerData={context.player.playerData} allCrew={context.core.crew} - src={`${process.env.GATSBY_ASSETS_URL}${c.imageUrlPortrait}`} + src={`${process.env.REACT_ASSETS_URL}${c.imageUrlPortrait}`} size={64} rarity={c.rarity} maxRarity={c.max_rarity} diff --git a/src/components/missions/path_table.tsx b/src/components/missions/path_table.tsx index c1730044f7..395cf0cd21 100644 --- a/src/components/missions/path_table.tsx +++ b/src/components/missions/path_table.tsx @@ -35,7 +35,7 @@ export const PathTable = (props: PathTableProps) => { const pathOpts = ["All"] as string[]; const pathMap = {} as { [key: string]: string }; - + solverResults?.paths?.forEach((p) => { if (!p.path_expanded) { p.path_expanded = splitPath(p.path).map(p => quest?.challenges?.find(f => f.id === p)).filter(f => !!f) as MissionChallenge[]; @@ -45,7 +45,7 @@ export const PathTable = (props: PathTableProps) => { if (!pathOpts.includes(astr)) { pathOpts.push(astr); pathMap[astr] = p.path; - } + } } }); @@ -76,15 +76,15 @@ export const PathTable = (props: PathTableProps) => { { width: 1, column: '', title: <>Paths } ] as ITableConfigRow[] - function renderRow(data: PathGroup, idx: number): JSX.Element { + function renderRow(data: PathGroup, idx: number): React.ReactNode { if (!quest) return <> - + return ( c.symbol).join(",")}> { ); } - + const filterRow = (data: PathGroup, filter: Filter[]) => { if (filter?.length && filter[0].textSegments?.length) { let seg = filter[0].textSegments[0]; const fres = !seg.negated; let text = seg.text.toLocaleLowerCase(); - if (data.crew.some((c) => c.name.toLocaleLowerCase().includes(text))) return fres; + if (data.crew.some((c) => c.name.toLocaleLowerCase().includes(text))) return fres; if (data.path_expanded?.some(ch => ch.name.toLocaleLowerCase().includes(text) || ch.trait_bonuses?.some(tr => tr.trait.toLocaleLowerCase() === text))) return fres; return false; //return !fres; @@ -110,12 +110,12 @@ export const PathTable = (props: PathTableProps) => { return true; } - - + + return ( - + {!props.targetGroup && } {!props.itemTargetGroup && } diff --git a/src/components/missions/quest_crew_table.tsx b/src/components/missions/quest_crew_table.tsx index b2b33e6627..21e04f5c0f 100644 --- a/src/components/missions/quest_crew_table.tsx +++ b/src/components/missions/quest_crew_table.tsx @@ -33,7 +33,7 @@ export const QuestCrewTable = (props: QuestCrewTableProps) => { { width: 2, column: 'challenge_key', title: 'Challenges' } ] - const renderTableCells = (row: IRosterCrew): JSX.Element => { + const renderTableCells = (row: IRosterCrew): React.ReactNode => { let crew = row as IQuestCrew; crew.challenges ??= []; @@ -133,7 +133,7 @@ export const QuestCrewTable = (props: QuestCrewTableProps) => { gridTemplateColumns: '32px auto' }}>
- +
{challenge.name} diff --git a/src/components/missions/quest_importer.tsx b/src/components/missions/quest_importer.tsx index 7f7e752ca5..c3e708c517 100644 --- a/src/components/missions/quest_importer.tsx +++ b/src/components/missions/quest_importer.tsx @@ -37,7 +37,7 @@ export const QuestImportComponent = (props: QuestImporterProps) => { return true; } - function renderCopyPaste(): JSX.Element { + function renderCopyPaste(): React.ReactNode { if (!quest) return <> return ( diff --git a/src/components/missions/questdropdown.tsx b/src/components/missions/questdropdown.tsx index 41856e7406..52dd6235a6 100644 --- a/src/components/missions/questdropdown.tsx +++ b/src/components/missions/questdropdown.tsx @@ -11,7 +11,7 @@ export interface QuestDropDownProps { multiple?: boolean; continuum?: boolean; setSelection: (value?: string | string[]) => void; - customRender?: (value: Quest) => JSX.Element; + customRender?: (value: Quest) => React.ReactNode; } export const QuestDropDown = (props: QuestDropDownProps) => { diff --git a/src/components/missions/trait_selector.tsx b/src/components/missions/trait_selector.tsx index ef0e906e72..73642ddfae 100644 --- a/src/components/missions/trait_selector.tsx +++ b/src/components/missions/trait_selector.tsx @@ -13,7 +13,7 @@ export interface TraitSelectorProps { traits: string[]; questId: number; preformatted?: boolean; - joinString?: string | JSX.Element; + joinString?: string | React.ReactNode; selectedTraits: TraitSelection[]; setSelectedTraits: (value: TraitSelection[]) => void; style?: React.CSSProperties; diff --git a/src/components/objective_events/mini_tools/mortal_helpers.tsx b/src/components/objective_events/mini_tools/mortal_helpers.tsx index 75732afd95..a37127e01c 100644 --- a/src/components/objective_events/mini_tools/mortal_helpers.tsx +++ b/src/components/objective_events/mini_tools/mortal_helpers.tsx @@ -135,7 +135,7 @@ export const FuseHelperMiniTool = (props: FuseHelperProps) => { style={{ width: '32px', padding: 4 }} onClick={() => navigate('/cite-opt')} > - +
@@ -283,7 +283,7 @@ export const CiteOptTable = (props: CiteOptTableProps) => { (Def export interface CiteOptContextProps { pageId: string; - children: JSX.Element; + children: React.ReactNode; eventData?: IEventData; } diff --git a/src/components/page/datapagelayout.tsx b/src/components/page/datapagelayout.tsx index 9cd5c898ab..5eaf269bf9 100644 --- a/src/components/page/datapagelayout.tsx +++ b/src/components/page/datapagelayout.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { withPrefix, graphql, useStaticQuery } from 'gatsby'; + import { Helmet as HelmetDep } from 'react-helmet'; import { GlobalContext } from '../../context/globalcontext'; @@ -15,7 +15,7 @@ import { EnergyLogContextProvider } from '../../context/energylogcontext'; const DEBUG_MODE = false; export interface DataPageLayoutProps { - children: JSX.Element; + children: React.ReactNode; pageId?: string; @@ -23,13 +23,13 @@ export interface DataPageLayoutProps { * Title of the page, for use in both datapage header, title, and meta tags */ pageTitle?: string; - pageTitleJSX?: JSX.Element; + pageTitleJSX?: React.ReactNode; /** * One or two-sentence description of the page, for use in both datapage header and meta tags */ pageDescription?: string; - pageDescriptionJSX?: JSX.Element; + pageDescriptionJSX?: React.ReactNode; /** * Default demands are crew, items, all_ships, all_buffs, and cadet @@ -110,15 +110,15 @@ const DataPageLayout = (props: T) => { description={pageDescription} /> { if (target === 'player') { setPlayerPanel(panel); - if (panel) scrollTo(contentAnchor); + if (panel) scrollTo(contentAnchor as any); } else if (target === 'dashboard') { setDashboardPanel(panel); - if (panel) scrollTo(topAnchor); + if (panel) scrollTo(topAnchor as any); } }} > @@ -127,7 +127,7 @@ const DataPageLayout = (props: T) => { { setPlayerPanel('input'); - scrollTo(contentAnchor); + scrollTo(contentAnchor as any); }} narrow={narrowLayout ?? false} activePanel={dashboardPanel} @@ -154,7 +154,7 @@ const DataPageLayout = (props: T) => { ); - function renderContents(): JSX.Element { + function renderContents(): React.ReactNode { if (DEBUG_MODE) console.log("renderContents()"); return ( @@ -186,21 +186,24 @@ type DataPageHelmetProps = { const DataPageHelmet = (props: DataPageHelmetProps) => { const { title, description } = props; - const data = useStaticQuery(graphql` - query { - site { - siteMetadata { - defaultTitle: title - titleTemplate - defaultDescription: description - baseUrl - } + const baseUrl = `${location?.protocol}${location?.host}`; + const data = { + site: { + siteMetadata: { + defaultTitle: title, + titleTemplate: '', + defaultDescription: description, + baseUrl } } - `); + } if (DEBUG_MODE) console.log("Helmet component render"); const Helmet = HelmetDep as any; + function withPrefix(arg0: string): string | undefined { + return arg0; + } + return ( {title && {title}} diff --git a/src/components/page/navigation.tsx b/src/components/page/navigation.tsx index b5b0561ef5..65c3d372b2 100644 --- a/src/components/page/navigation.tsx +++ b/src/components/page/navigation.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { navigate } from "gatsby"; +import { navigate } from "../../context/globalcontext"; import { Menu, Dropdown, Icon, Sidebar, Grid, Container } from "semantic-ui-react"; import { v4 } from "uuid"; import { GlobalContext } from "../../context/globalcontext"; @@ -15,7 +15,7 @@ import { AlertContext } from '../alerts/alertprovider'; type NavigationProps = { requestPanel: (target: string, panel: string | undefined) => void; sidebarTarget?: React.RefObject; - children: JSX.Element; + children: React.ReactNode; }; function printLang(lang?: SupportedLanguage) { @@ -26,15 +26,15 @@ function printLang(lang?: SupportedLanguage) { function getLanguageIcon(lang?: SupportedLanguage) { switch (lang) { case 'en': - return `${process.env.GATSBY_ASSETS_URL}atlas/flag_english_icon.png`; + return `${process.env.REACT_ASSETS_URL}atlas/flag_english_icon.png`; case 'de': - return `${process.env.GATSBY_ASSETS_URL}atlas/flag_german_icon.png`; + return `${process.env.REACT_ASSETS_URL}atlas/flag_german_icon.png`; case 'fr': - return `${process.env.GATSBY_ASSETS_URL}atlas/flag_french_icon.png`; + return `${process.env.REACT_ASSETS_URL}atlas/flag_french_icon.png`; case 'sp': - return `${process.env.GATSBY_ASSETS_URL}atlas/flag_spanish_icon.png`; + return `${process.env.REACT_ASSETS_URL}atlas/flag_spanish_icon.png`; default: - return `${process.env.GATSBY_ASSETS_URL}atlas/flag_english_icon.png`; + return `${process.env.REACT_ASSETS_URL}atlas/flag_english_icon.png`; } } @@ -85,7 +85,7 @@ export const Navigation = (props: NavigationProps) => { // props.requestPanel(target, panel); // setOpenBar(false); // } - let portrait = `${process.env.GATSBY_ASSETS_URL}${globalContext.player.playerData?.player?.character?.crew_avatar + let portrait = `${process.env.REACT_ASSETS_URL}${globalContext.player.playerData?.player?.character?.crew_avatar ? (globalContext.player.playerData?.player?.character?.crew_avatar?.portrait?.file ?? globalContext.player.playerData?.player?.character?.crew_avatar?.portrait ?? 'crew_portraits_cm_empty_sm.png') : 'crew_portraits_cm_empty_sm.png'}`; @@ -102,7 +102,7 @@ export const Navigation = (props: NavigationProps) => { // { optionKey: 'fleet', title: "Fleet", src: '/media/fleet_icon.png', link: "/fleet", sidebarRole: 'item' }, // Factions available at launch { optionKey: 'event', src: '/media/event.png', title: t('menu.tools.event_planner'), link: "/eventplanner", sidebarRole: 'item' }, // Events added post-launch { optionKey: 'gauntlet', src: '/media/gauntlet.png', title: t('menu.tools.gauntlet'), link: "/gauntlets", sidebarRole: 'item' }, // Gauntlet added v1.7 - { optionKey: 'cite', src: `${process.env.GATSBY_ASSETS_URL}/atlas/star_reward.png`, title: t('menu.tools.citation_optimizer'), link: "/cite-opt", sidebarRole: 'item' }, // Citations added 1.9 + { optionKey: 'cite', src: `${process.env.REACT_ASSETS_URL}/atlas/star_reward.png`, title: t('menu.tools.citation_optimizer'), link: "/cite-opt", sidebarRole: 'item' }, // Citations added 1.9 { optionKey: 'voyage', src: "/media/voyage.png", title: t('menu.tools.voyage_calculator'), link: "/voyage", sidebarRole: 'item' }, // Voyages added v3 { optionKey: 'voyhist', src: "/media/antimatter_icon.png", title: t('menu.tools.voyage_history'), link: "/voyagehistory", sidebarRole: 'item' }, // Voyages added v3 { optionKey: 'collection', src: '/media/vault.png', title: t('menu.tools.collection_planner'), link: "/collections", sidebarRole: 'item' }, // Collections added v4 @@ -137,7 +137,7 @@ export const Navigation = (props: NavigationProps) => { } }, { - src: `${process.env.GATSBY_ASSETS_URL}${'crew_portraits_cm_empty_sm.png'}`, + src: `${process.env.REACT_ASSETS_URL}${'crew_portraits_cm_empty_sm.png'}`, title: isMobile ? undefined : t('menu.player.import_player_data_ellipses'), customAction: () => props.requestPanel('player', 'input'), checkVisible: (data) => { @@ -286,7 +286,7 @@ export const Navigation = (props: NavigationProps) => { // src: '/media/crew_icon.png', // subMenu: [ // { optionKey: 'behold', src: '/media/portal.png',title: "Behold Helper", link: "/behold", sidebarRole: 'item' }, // Behold available at launch - // { optionKey: 'cite', src: `${process.env.GATSBY_ASSETS_URL}/atlas/star_reward.png`, title: "Citation Optimizer", link: "/cite-opt", sidebarRole: 'item' }, // Citations added 1.9 + // { optionKey: 'cite', src: `${process.env.REACT_ASSETS_URL}/atlas/star_reward.png`, title: "Citation Optimizer", link: "/cite-opt", sidebarRole: 'item' }, // Citations added 1.9 // { optionKey: 'collection', src: '/media/vault.png', title: "Collection Planner", link: "/collections", sidebarRole: 'item' }, // Collections added v4 // { optionKey: 'retrieval', src: '/media/retrieval.png', title: "Crew Retrieval", link: "/retrieval", sidebarRole: 'item' }, // Crew retrieval added v8 // ] @@ -428,9 +428,9 @@ export const Navigation = (props: NavigationProps) => { ); }); - const sidebarItems = [] as JSX.Element[]; - const menuItems = [] as JSX.Element[]; - const rightItems = [] as JSX.Element[]; + const sidebarItems = [] as React.ReactNode[]; + const menuItems = [] as React.ReactNode[]; + const rightItems = [] as React.ReactNode[]; for (let page of pages) { if (page.right) continue; diff --git a/src/components/page/notification.tsx b/src/components/page/notification.tsx index 4f7af17cef..b100c82563 100644 --- a/src/components/page/notification.tsx +++ b/src/components/page/notification.tsx @@ -3,7 +3,7 @@ import { Message, Icon, SemanticICONS, SemanticCOLORS } from 'semantic-ui-react' type NotificationProps = { header: string; - content: JSX.Element; + content: React.ReactNode; icon?: SemanticICONS; color?: SemanticCOLORS; warning?: boolean; diff --git a/src/components/page/playerbadge.tsx b/src/components/page/playerbadge.tsx index 8e7e6f9a0d..457f2c9ff6 100644 --- a/src/components/page/playerbadge.tsx +++ b/src/components/page/playerbadge.tsx @@ -15,7 +15,7 @@ export const PlayerBadge = (props: PlayerBadgeProps) => { const { crewLimit, unfrozen, immortal, avatar } = React.useMemo(() => { - let portrait = `${process.env.GATSBY_ASSETS_URL}${playerData?.player?.character?.crew_avatar + let portrait = `${process.env.REACT_ASSETS_URL}${playerData?.player?.character?.crew_avatar ? (playerData?.player?.character?.crew_avatar?.portrait?.file ?? playerData?.player?.character?.crew_avatar?.portrait ?? 'crew_portraits_cm_empty_sm.png') : 'crew_portraits_cm_empty_sm.png'}`; diff --git a/src/components/page/playerglance.tsx b/src/components/page/playerglance.tsx index a3b057ebf4..e4e135aab2 100644 --- a/src/components/page/playerglance.tsx +++ b/src/components/page/playerglance.tsx @@ -1,4 +1,4 @@ -import { navigate } from "gatsby"; +import { navigate } from "../../context/globalcontext"; import React from "react"; import { Button, Icon, Image, Label } from "semantic-ui-react"; import { GlobalContext } from "../../context/globalcontext"; @@ -25,7 +25,7 @@ export interface PlayerResource { imageUrl?: string; style?: React.CSSProperties; click?: (e: any) => void; - customRender?: (item: PlayerResource) => JSX.Element; + customRender?: (item: PlayerResource) => React.ReactNode; } export interface PlayerGlanceProps { @@ -134,14 +134,14 @@ export const PlayerGlance = (props: PlayerGlanceProps) => { }} onClick={() => navigate('/eventplanner')} title={currentEvent.name}> - +

{currentEvent.victory_points?.toLocaleString()} {t('shuttle_helper.event.vp')}

 — 

- {!!currentEventCrew && } + {!!currentEventCrew && }

{currentEvent.name}

@@ -166,7 +166,7 @@ export const PlayerGlance = (props: PlayerGlanceProps) => { padding: '0.25em 0.75em', backgroundColor: colorToRGBA(CONFIG.RARITIES[5].color, 0.3) }}> - + {t('sales.honor_sale')}
)} @@ -181,7 +181,7 @@ export const PlayerGlance = (props: PlayerGlanceProps) => { padding: '0.25em 0.75em', backgroundColor: colorToRGBA(CONFIG.RARITIES[4].color, 0.3) }}> - + {t('sales.slot_sale')}
)} @@ -192,7 +192,7 @@ export const PlayerGlance = (props: PlayerGlanceProps) => { gap: '0.5em', margin: '0' }}> - + {t('global.supply_kit_active_n', { n: supplyKit })} )} @@ -251,28 +251,28 @@ export const PlayerGlance = (props: PlayerGlanceProps) => { revival = coreRevival; } - const honorimg = `${process.env.GATSBY_ASSETS_URL}atlas/honor_currency.png`; + const honorimg = `${process.env.REACT_ASSETS_URL}atlas/honor_currency.png`; let resources = [ { name: t('global.item_types.chronitons'), quantity: chrons, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/energy_icon.png` + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/energy_icon.png` }, { name: t('global.item_types.credits'), quantity: money, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/soft_currency_icon.png` + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/soft_currency_icon.png` }, { name: t('global.item_types.dilithium'), quantity: premium_purchasable, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/pp_currency_icon.png` + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/pp_currency_icon.png` }, { name: t('global.item_types.merits'), quantity: premium_earnable ?? 0, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/pe_currency_icon.png` + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/pe_currency_icon.png` }, { name: t('global.item_types.honor'), @@ -282,48 +282,48 @@ export const PlayerGlance = (props: PlayerGlanceProps) => { { name: t('global.item_types.valor'), quantity: valor ?? 0, - imageUrl: `${process.env.GATSBY_ASSETS_URL}fleet_boss_battles_icons_fbb_energy_icon.png`, + imageUrl: `${process.env.REACT_ASSETS_URL}fleet_boss_battles_icons_fbb_energy_icon.png`, click: (e) => navigate('/fbb') }, { name: t('global.item_types.quantum'), quantity: quantum ?? 0, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/crew_crafting_energy_detailed_icon.png`, + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/crew_crafting_energy_detailed_icon.png`, click: (e) => navigate('/retrieval') }, { name: t('global.item_types.interstellar_medium'), quantity: ism ?? 0, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/managed_game_coin_detailed_icon.png`, + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/managed_game_coin_detailed_icon.png`, click: (e) => navigate('/retrieval') }, { name: t('global.item_types.arena_tickets'), quantity: pvp, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/fleetmarker_icon.png`, + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/fleetmarker_icon.png`, click: (e) => navigate('/ships') }, { name: t('global.item_types.cadet_challenge_tickets'), quantity: cadet, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/cadet_icon.png` + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/cadet_icon.png` }, { name: t('global.item_types.voyage_consumable'), quantity: revival?.quantity ?? 0, - imageUrl: `${process.env.GATSBY_ASSETS_URL}${revival?.imageUrl ?? (revival.icon ? getIconPath(revival.icon, true) : '')}`, + imageUrl: `${process.env.REACT_ASSETS_URL}${revival?.imageUrl ?? (revival.icon ? getIconPath(revival.icon, true) : '')}`, click: (e) => navigate('/voyage') }, { name: t('global.item_types.shuttle_token'), quantity: shuttle_rental_tokens ?? 0, - imageUrl: `${process.env.GATSBY_ASSETS_URL}atlas/icon_shuttle_token.png`, + imageUrl: `${process.env.REACT_ASSETS_URL}atlas/icon_shuttle_token.png`, click: (e) => navigate('/shuttlehelper') }, { name: t('global.item_types.conquest_token'), quantity: conquest_tokens ?? 0, - imageUrl: `${process.env.GATSBY_ASSETS_URL}${CONQUEST_CURRENCY_ICON}`, + imageUrl: `${process.env.REACT_ASSETS_URL}${CONQUEST_CURRENCY_ICON}`, click: (e) => navigate('/seasonal') } @@ -333,7 +333,7 @@ export const PlayerGlance = (props: PlayerGlanceProps) => { if (idx === 0) return; if (cite.quantity <= 0 && idx !== 5) return; let item = globalContext.core.items.find(f => f.symbol === `honorable_citation_quality${idx}`); - const img = `${process.env.GATSBY_ASSETS_URL}${item?.imageUrl}`; + const img = `${process.env.REACT_ASSETS_URL}${item?.imageUrl}`; if (cite.quantity > 0) { resources.push({ @@ -349,7 +349,7 @@ export const PlayerGlance = (props: PlayerGlanceProps) => { }); const cite = globalContext.core.items.find(f => f.symbol === `honorable_citation_quality5`); - const cite5img = `${process.env.GATSBY_ASSETS_URL}${cite?.imageUrl}`; + const cite5img = `${process.env.REACT_ASSETS_URL}${cite?.imageUrl}`; const p_cites = Math.floor(honor / (costMode === 'normal' ? 50000 : 40000)); resources.push({ @@ -445,7 +445,7 @@ export const PlayerGlance = (props: PlayerGlanceProps) => { } export async function loadSaleData() { - const response = await fetch(`${process.env.GATSBY_DATACORE_URL}api/sales`); + const response = await fetch(`${process.env.REACT_DATACORE_URL}api/sales`); let sale = (await response.json()) as SaleData; return sale; } \ No newline at end of file diff --git a/src/components/page/playermenu.tsx b/src/components/page/playermenu.tsx index 53607774c8..8aa5430352 100644 --- a/src/components/page/playermenu.tsx +++ b/src/components/page/playermenu.tsx @@ -1,11 +1,10 @@ import React from 'react'; -import { GlobalContext } from '../../context/globalcontext'; -import { NavItem, createSubMenu, renderSubmenuItem } from '../page/util'; -import NavigationSettings, { NavigationSettingsConfig } from '../page/settings'; import { Dropdown, Icon } from 'semantic-ui-react'; -import { useStateWithStorage } from '../../utils/storage'; +import { GlobalContext } from '../../context/globalcontext'; import { AlertContext } from '../alerts/alertprovider'; +import NavigationSettings, { NavigationSettingsConfig } from '../page/settings'; +import { NavItem, createSubMenu, renderSubmenuItem } from '../page/util'; type PlayerMenuProps = { requestPanel: (target: string, panel: string | undefined) => void; @@ -13,7 +12,7 @@ type PlayerMenuProps = { navConfig?: NavigationSettingsConfig; }; -export const PlayerMenu = (props: PlayerMenuProps): JSX.Element => { +export const PlayerMenu = (props: PlayerMenuProps): React.ReactNode => { const globalContext = React.useContext(GlobalContext); const alertContext = React.useContext(AlertContext); const { setAlertOpen, config: alertConfig, drawAlertModal, setRestoreHiddenAlerts } = alertContext; diff --git a/src/components/page/settings.tsx b/src/components/page/settings.tsx index 5cfbf86031..36a38815d7 100644 --- a/src/components/page/settings.tsx +++ b/src/components/page/settings.tsx @@ -19,9 +19,9 @@ export interface NavigationSettingsConfig { } export interface NavigationSettingsProps { - - config: NavigationSettingsConfig; - renderTrigger?: () => JSX.Element; + + config: NavigationSettingsConfig; + renderTrigger?: () => React.ReactNode; setIsOpen: (value: boolean) => void; isOpen: boolean; @@ -29,14 +29,14 @@ export interface NavigationSettingsProps { const NavigationSettings = (props: NavigationSettingsProps) => { const context = React.useContext(GlobalContext); - const { config } = props; + const { config } = props; const [modalIsOpen, setModalIsOpen] = React.useState(false); - const inputRef = React.createRef(); + const inputRef = React.createRef(); const [workConf, setWorkConf] = React.useState(config); const menuItems = getAllOptions(config.menu); - + const [showCopied, setShowCopied] = React.useState(false); if (typeof window !== 'undefined' && document.location.search) { @@ -61,7 +61,7 @@ const NavigationSettings = (props: NavigationSettingsProp setWorkConf({ ... workConf, mobileCurrent: current }); } - + const setCurrent = (current: string[]) => { setWorkConf({ ... workConf, current: current }); } @@ -105,7 +105,7 @@ const NavigationSettings = (props: NavigationSettingsProp
-
-
- + ); - function renderGrid(): JSX.Element { - + function renderGrid(): React.ReactNode { + const opts = [workConf.current, workConf.mobileCurrent]; const maxes = [workConf.maxItems, workConf.maxItemsMobile]; const titles = ['Menu Options', 'Mobile Menu Options']; @@ -193,7 +193,7 @@ const NavigationSettings = (props: NavigationSettingsProp setModalIsOpen(false); } - function renderDefaultTrigger(): JSX.Element { + function renderDefaultTrigger(): React.ReactNode { return ( ; } - function renderSubhead(): JSX.Element { + function renderSubhead(): React.ReactNode { if (!uniqueCombos || uniqueCombos.length === 0) return <>; if (playerData) { @@ -219,7 +219,7 @@ export const CombosModal = (props: CombosModalProps) => { ); } - function renderWishlist(): JSX.Element { + function renderWishlist(): React.ReactNode { if (!playerData) return <>; const onWishlist = wishlist.includes(crew.symbol); const autoWish = autoWishes.includes(crew.symbol) && !wishlist.includes(crew.symbol); @@ -260,7 +260,7 @@ export const CombosModal = (props: CombosModalProps) => { } } - function renderContent(): JSX.Element { + function renderContent(): React.ReactNode { if (!modalIsOpen) return <>; if (!uniqueCombos) return <>; @@ -290,7 +290,7 @@ export const CombosModal = (props: CombosModalProps) => { } } - let preface: JSX.Element | undefined; + let preface: React.ReactNode | undefined; if (crew.actionable === ActionableState.PreTailor) preface = <>You can retrieve this crew with your current polestar inventory, but you will need to use 1 or more ; else if (crew.actionable === ActionableState.PostTailor) diff --git a/src/components/retrieval/combosgrid.tsx b/src/components/retrieval/combosgrid.tsx index b0a5e7cdab..a9aa253180 100644 --- a/src/components/retrieval/combosgrid.tsx +++ b/src/components/retrieval/combosgrid.tsx @@ -58,7 +58,7 @@ export const CombosGrid = (props: CombosGridProps) => { {combo.sort(sortPolestars).map((polestar, pdx) => ( - +
{polestar.short_name} {(playerData || !!alwaysShowPrice) && ( @@ -116,7 +116,7 @@ export const CombosGrid = (props: CombosGridProps) => { return a.name.localeCompare(b.name); } - function renderCount(polestar: IPolestar): JSX.Element { + function renderCount(polestar: IPolestar): React.ReactNode { let labelColor: SemanticCOLORS | undefined = undefined; let fontColor: SemanticCOLORS | undefined = undefined; diff --git a/src/components/retrieval/combosplanner.tsx b/src/components/retrieval/combosplanner.tsx index 248242ac8f..6e4fd70b2b 100644 --- a/src/components/retrieval/combosplanner.tsx +++ b/src/components/retrieval/combosplanner.tsx @@ -78,7 +78,7 @@ const UsefulPolestars = (props: UsefulPolestarsProps) => { ); - function renderUsefulPolestars(): JSX.Element { + function renderUsefulPolestars(): React.ReactNode { return (
{usefulAlone.length > 0 && ( @@ -109,7 +109,7 @@ const UsefulPolestars = (props: UsefulPolestarsProps) => { ); } - function renderPolestarsInline(polestars: IPolestar[]): JSX.Element { + function renderPolestarsInline(polestars: IPolestar[]): React.ReactNode { if (polestars.length === 1) return ; @@ -126,7 +126,7 @@ const UsefulPolestars = (props: UsefulPolestarsProps) => { ); } - function renderUsableConstellations(): JSX.Element { + function renderUsableConstellations(): React.ReactNode { const usablePolestars = allPolestars.filter(polestar => polestar.owned_crate_count > 0 && (usefulAloneIds.includes(polestar.id) || usefulOtherIds.includes(polestar.id))); if (usablePolestars.length === 0) return <>; diff --git a/src/components/retrieval/context.tsx b/src/components/retrieval/context.tsx index d2f4dc6ec7..023f6d4bbd 100644 --- a/src/components/retrieval/context.tsx +++ b/src/components/retrieval/context.tsx @@ -23,7 +23,7 @@ export interface IRetrievalContext { }; export function printConquest(quantity: number, t?: TranslateMethod, printTicket?: boolean) { - const img = `${process.env.GATSBY_ASSETS_URL}${CONQUEST_CURRENCY_ICON}`; + const img = `${process.env.REACT_ASSETS_URL}${CONQUEST_CURRENCY_ICON}`; return
{ >
- +
@@ -132,7 +132,7 @@ const CrewRow = (props: CrewRowProps) => { ); - function renderDefaultCells(): JSX.Element { + function renderDefaultCells(): React.ReactNode { return ( @@ -162,11 +162,11 @@ const CrewRow = (props: CrewRowProps) => { ); } - function renderQuipment(crew: IRosterCrew): JSX.Element { + function renderQuipment(crew: IRosterCrew): React.ReactNode { return renderAnyDataScore(crew, 'quipment', t); } - function renderRetrieval(crew: IRosterCrew): JSX.Element { + function renderRetrieval(crew: IRosterCrew): React.ReactNode { if (crew.retrievable === RetrievableState.Never) return ; else if (crew.retrievable === RetrievableState.InFuture) diff --git a/src/components/retrieval/energy.tsx b/src/components/retrieval/energy.tsx index 1c16950172..359dd842c4 100644 --- a/src/components/retrieval/energy.tsx +++ b/src/components/retrieval/energy.tsx @@ -29,7 +29,7 @@ export const RetrievalEnergy = () => { const qTarget = 900; const qPerFullDay = (24*60*60)/(energy.regeneration?.seconds ?? defaultSeconds); // 48 const qPerBoost = 50; - let energyMessage = [] as JSX.Element[]; + let energyMessage = [] as React.ReactNode[]; energyMessage.push(tfmt('retrieval.energy.guaranteed_legendary')); if (energy.quantity < qTarget) { const regenerationTime = getSecondsRemaining(qTarget, energy.quantity); diff --git a/src/components/retrieval/polestarfilter.tsx b/src/components/retrieval/polestarfilter.tsx index c51bb64998..44aacef4ff 100644 --- a/src/components/retrieval/polestarfilter.tsx +++ b/src/components/retrieval/polestarfilter.tsx @@ -86,8 +86,8 @@ export const PolestarFilterModal = () => { ); - function createFilterCheckboxes(): JSX.Element[] { - const checkboxes: JSX.Element[] = []; + function createFilterCheckboxes(): React.ReactNode[] { + const checkboxes: React.ReactNode[] = []; grouped.map((group) => { if(group.polestars.length > 0) { checkboxes.push(filterCheckboxGroupHeader(group.title)); @@ -99,7 +99,7 @@ export const PolestarFilterModal = () => { return checkboxes; } - function filterCheckbox(p: IPolestar): JSX.Element { + function filterCheckbox(p: IPolestar): React.ReactNode { return ( { ) } - function filterCheckboxGroupHeader(title: string): JSX.Element { + function filterCheckboxGroupHeader(title: string): React.ReactNode { const group = grouped.find(group => group.title === title); if (!group) return <>; const groupLink = ; diff --git a/src/components/retrieval/polestarmultiworker.tsx b/src/components/retrieval/polestarmultiworker.tsx index 4728d2db67..d3b592f237 100644 --- a/src/components/retrieval/polestarmultiworker.tsx +++ b/src/components/retrieval/polestarmultiworker.tsx @@ -9,7 +9,7 @@ export interface PolestarWorkerResults extends IWorkerResults, IPolestarWorkerConfig, IPolestarWorkerItem> { protected itemPassAccepted: boolean = false; protected createWorker(): Worker { - return new Worker(new URL('../../workers/polestar-worker.js', import.meta.url)) + //return new Worker(new URL('../../workers/polestar-worker.js', import.meta.url)) + return new Worker(new URL('../../workers/polestar-worker.js', location.origin)) } constructor(props: PolestarMultiWorkerProps) { diff --git a/src/components/retrieval/polestarprospects.tsx b/src/components/retrieval/polestarprospects.tsx index 78a950d041..8c1b44b863 100644 --- a/src/components/retrieval/polestarprospects.tsx +++ b/src/components/retrieval/polestarprospects.tsx @@ -113,7 +113,7 @@ export const PolestarProspectsModal = () => { ); - function renderContent(): JSX.Element { + function renderContent(): React.ReactNode { if (!modalIsOpen) return <>; if (activePolestar !== '') @@ -122,7 +122,7 @@ export const PolestarProspectsModal = () => { return renderPolestarFinder(); } - function renderPolestarFinder(): JSX.Element { + function renderPolestarFinder(): React.ReactNode { const constellationList = [ { key: 'none', value: '', text: t('retrieval.prospects.show_all_polestars') } @@ -207,7 +207,7 @@ export const PolestarProspectsModal = () => { return meetsAnyCondition; } - function renderPolestarRow(polestar: IPolestarData, idx: number): JSX.Element { + function renderPolestarRow(polestar: IPolestarData, idx: number): React.ReactNode { return ( { }} >
- +
{polestar.short_name} @@ -252,7 +252,7 @@ export const PolestarProspectsModal = () => { ); } - function renderConstellationMessage(data: IPolestar[]): JSX.Element { + function renderConstellationMessage(data: IPolestar[]): React.ReactNode { if (activeConstellation === '') return <>; const constellation = allKeystones.find(k => k.symbol === activeConstellation) as IConstellation | undefined; @@ -275,7 +275,7 @@ export const PolestarProspectsModal = () => { ); } - function renderPolestarDetail(): JSX.Element { + function renderPolestarDetail(): React.ReactNode { const polestar = allKeystones.find(k => k.symbol === activePolestar) as IPolestarData | undefined; if (!polestar) return <>; @@ -314,7 +314,7 @@ export const PolestarProspectsModal = () => { ); } - function renderUnlockableCrew(polestar: IPolestar): JSX.Element { + function renderUnlockableCrew(polestar: IPolestar): React.ReactNode { const allPolestars = allKeystones.filter(k => k.type === 'keystone') as IPolestar[]; const ownedPolestars = allPolestars.filter(polestar => polestar.owned > 0); const unlockableCrew = rosterCrew.filter(crew => diff --git a/src/components/retrieval/wishlist.tsx b/src/components/retrieval/wishlist.tsx index dd458536fb..3eff1cdb13 100644 --- a/src/components/retrieval/wishlist.tsx +++ b/src/components/retrieval/wishlist.tsx @@ -119,7 +119,7 @@ export const WishlistManager = (props: WishlistManagerProps) => { props.closePicker(); } - function renderOptions(state: IDataPickerState): JSX.Element { + function renderOptions(state: IDataPickerState): React.ReactNode { return ( {props.powerFiltering && ( @@ -138,7 +138,7 @@ export const WishlistManager = (props: WishlistManagerProps) => { ); } - function renderPreface(state: IDataPickerState): JSX.Element { + function renderPreface(state: IDataPickerState): React.ReactNode { if (state.data.length === 0) return <>; return ( @@ -155,7 +155,7 @@ export const WishlistManager = (props: WishlistManagerProps) => { ); } - function renderActions(state: IDataPickerState): JSX.Element { + function renderActions(state: IDataPickerState): React.ReactNode { return ( {props.powerFiltering && state.data.length > 0 && ( @@ -220,7 +220,7 @@ const GridCrew = (props: GridCrewProps) => {
- +
{isSelected && ( ); - function renderRetrieval(crew: IRosterCrew): JSX.Element { + function renderRetrieval(crew: IRosterCrew): React.ReactNode { if (crew.retrievable === RetrievableState.Never) return ; else if (crew.retrievable === RetrievableState.InFuture) @@ -374,7 +374,7 @@ const ManageOptions = (props: ManageOptionsProps) => { type='file' onChange={e => handleFileUpload(e)} style={{ display: 'none' }} - ref={e => inputUploadFile = e} + ref={e => inputUploadFile = e as any} /> diff --git a/src/components/searchabletable.tsx b/src/components/searchabletable.tsx index 1717ae8fb4..098ae356a0 100644 --- a/src/components/searchabletable.tsx +++ b/src/components/searchabletable.tsx @@ -44,13 +44,13 @@ export interface SortConfig { export interface ITableConfigRow { width: number; column?: string; - title: string | JSX.Element; + title: string | React.ReactNode; pseudocolumns?: string[]; reverse?: boolean; tiebreakers?: string[]; tiebreakers_reverse?: boolean[]; customCompare?: (a: any, b: any, config: IConfigSortData) => number; - translatePseudocolumn?: (field: string) => string | JSX.Element; + translatePseudocolumn?: (field: string) => string | React.ReactNode; } export interface SearchableTableInitOptions { @@ -69,7 +69,7 @@ export interface SearchableTableProps { config: ITableConfigRow[]; overflowX?: 'visible' | 'hidden' | 'clip' | 'scroll' | 'auto'; - renderTableRow: (row: any, idx?: number, isActive?: boolean) => JSX.Element; + renderTableRow: (row: any, idx?: number, isActive?: boolean) => React.ReactNode; noSearch?: boolean; initOptions?: SearchableTableInitOptions; @@ -79,7 +79,7 @@ export interface SearchableTableProps { showFilterOptions?: boolean; showPermalink?: boolean; lockable?: any[]; - zeroMessage?: (searchFilter: string) => JSX.Element; + zeroMessage?: (searchFilter: string) => React.ReactNode; toolCaption?: string; dropDownChoices?: string[]; @@ -166,7 +166,7 @@ export const SearchableTable = (props: SearchableTableProps) => { setPaginationPage(1); } - function renderTableHeader(column: any, direction: 'descending' | 'ascending' | undefined): JSX.Element { + function renderTableHeader(column: any, direction: 'descending' | 'ascending' | undefined): React.ReactNode { return ( {props.config.map((cell, idx) => ( @@ -190,7 +190,7 @@ export const SearchableTable = (props: SearchableTableProps) => { ); } - function renderPermalink(): JSX.Element { + function renderPermalink(): React.ReactNode { // Will not catch custom options (e.g. highlight) const params = new URLSearchParams(); if (searchFilter != '') params.append('search', searchFilter); @@ -662,7 +662,7 @@ export const prettyCrewColumnTitle = (column: string) => { return column; }; -function renderDefaultZeroMessage(): JSX.Element { +function renderDefaultZeroMessage(): React.ReactNode { const { t } = React.useContext(GlobalContext).localized; return ( @@ -675,7 +675,7 @@ function renderDefaultZeroMessage(): JSX.Element { ); } -function renderDefaultExplanation(): JSX.Element { +function renderDefaultExplanation(): React.ReactNode { return (

diff --git a/src/components/ship/advancedpower.tsx b/src/components/ship/advancedpower.tsx index fcba25c3a6..d197881f8b 100644 --- a/src/components/ship/advancedpower.tsx +++ b/src/components/ship/advancedpower.tsx @@ -9,7 +9,7 @@ import { DEFAULT_MOBILE_WIDTH } from '../hovering/hoverstat'; export interface AdvancedCrewPowerProps { isOpen: boolean; setIsOpen: (value: boolean) => void; - renderTrigger?: (disabled?: boolean) => JSX.Element; + renderTrigger?: (disabled?: boolean) => React.ReactNode; config: AdvancedCrewPowerConfig; disabled?: boolean; } @@ -19,7 +19,7 @@ const AdvancedCrewPowerPopup = (props: AdvancedCrewPowerP const { t, tfmt } = globalContext.localized; const { disabled, config } = props; const [modalIsOpen, setModalIsOpen] = React.useState(false); - const inputRef = React.createRef(); + const inputRef = React.createRef(); // const [workConf, setWorkConf] = React.useState(config); const [innerSettings, setInnerSettings] = React.useState(config.current); @@ -121,7 +121,7 @@ const AdvancedCrewPowerPopup = (props: AdvancedCrewPowerP ); - function renderGrid(): JSX.Element { + function renderGrid(): React.ReactNode { const rowStyle = { display: "flex", @@ -257,7 +257,7 @@ const AdvancedCrewPowerPopup = (props: AdvancedCrewPowerP setModalIsOpen(false); } - function renderDefaultTrigger(): JSX.Element { + function renderDefaultTrigger(): React.ReactNode { return (

- +

{tfmt('voyage.results.messages.failed_with_inputs', { inputs: renderInputOptions() })}

- + ); } diff --git a/src/components/voyagecalculator/calculator/results.tsx b/src/components/voyagecalculator/calculator/results.tsx index 4aa984fd7a..a13dce3c4e 100644 --- a/src/components/voyagecalculator/calculator/results.tsx +++ b/src/components/voyagecalculator/calculator/results.tsx @@ -6,7 +6,8 @@ import { Message, Popup, SemanticICONS, - Tab + Tab, + TabPane } from 'semantic-ui-react'; import { Voyage } from '../../../model/player'; @@ -71,12 +72,12 @@ export const ResultPane = (props: ResultPaneProps) => { if (!proposal) { return ( - +
- + ); } @@ -147,7 +148,7 @@ export const ResultPane = (props: ResultPaneProps) => { {tfmt('voyage.estimate.projected_vp', { n: {proposal.estimate.vpDetails.total_vp.toLocaleString()} })} - {` `}; + {` `}; {` `}{tfmt('voyage.estimate.event_crew_bonus', { n: +{t('global.n_%', { n: Math.round((proposal.eventCrewBonus ?? 0) * 100) })} })} @@ -196,7 +197,7 @@ export const ResultPane = (props: ResultPaneProps) => {
)} - +
{ {calcState === CalculatorState.Done && ( )} - + ); diff --git a/src/components/voyagecalculator/calculator/resultsgroup.tsx b/src/components/voyagecalculator/calculator/resultsgroup.tsx index eecb7f3dc3..cc81eadf5f 100644 --- a/src/components/voyagecalculator/calculator/resultsgroup.tsx +++ b/src/components/voyagecalculator/calculator/resultsgroup.tsx @@ -179,7 +179,7 @@ export const ResultsGroup = (props: ResultsGroupProps) => { ); - function renderMenuItem(name: string, analysis: string): JSX.Element { + function renderMenuItem(name: string, analysis: string): React.ReactNode { if (analysis !== '') { return ( JSX.Element; + renderToggle: () => React.ReactNode; }; export const ConfigCard = (props: ConfigCardProps) => { @@ -106,7 +106,7 @@ const RunningShipIcon = (props: RunningShipIconProps) => { if (shipIcon === '') return <>; return ( - + ); }; @@ -122,11 +122,11 @@ const ConfigSkills = (props: ConfigSkillsProps) => { return ( {voyageConfig.ship_trait !== '' && ( diff --git a/src/components/voyagecalculator/configeditor.tsx b/src/components/voyagecalculator/configeditor.tsx index 5ff7ccfeb6..4d1e42a043 100644 --- a/src/components/voyagecalculator/configeditor.tsx +++ b/src/components/voyagecalculator/configeditor.tsx @@ -128,11 +128,11 @@ export const ConfigEditor = (props: ConfigEditorProps) => { updateConfig(voyageConfig); } - function renderTrigger(): JSX.Element { + function renderTrigger(): React.ReactNode { return