aotds/aotds-docks
1
0
Fork 0
Code Issues 28 Pull Requests Projects 2 Releases Wiki Activity

upgrading sveltekit

Browse Source
This commit is contained in:
Yanick Champoux 2023-03-03 18:02:52 -05:00
parent b4a58694d7
commit 0c0351cbb3
20 changed files with 311 additions and 233 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
package.json
View File

@ -8,15 +8,11 @@
"build": "svelte-kit build", "build": "svelte-kit build",
"preview": "svelte-kit preview", "preview": "svelte-kit preview",
"lint": "prettier --check . && eslint --ignore-path .gitignore .", "lint": "prettier --check . && eslint --ignore-path .gitignore .",
"format": "prettier --write .", "format": "prettier --write ."
"storybook": "storybook-server",
"vitebook:dev": "vitebook dev",
"vitebook:build": "vitebook build",
"vitebook:preview": "vitebook preview"
}, },
"devDependencies": { "devDependencies": {
"@sveltejs/adapter-static": "^1.0.0-next.28", "@sveltejs/adapter-static": "^1.0.0-next.28",
"@sveltejs/kit": "^1.0.0-next.288", "@sveltejs/kit": "^1.10.0",
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.38", "@sveltejs/vite-plugin-svelte": "^1.0.0-next.38",
"@testing-library/svelte": "^3.1.1", "@testing-library/svelte": "^3.1.1",
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^13.5.0",
@ -26,18 +22,13 @@
"prettier": "~2.5.1", "prettier": "~2.5.1",
"prettier-plugin-svelte": "^2.6.0", "prettier-plugin-svelte": "^2.6.0",
"showdown": "^2.0.3", "showdown": "^2.0.3",
"standard-version": "^9.3.2", "svelte": "^3.55.1",
"storybook-builder-vite": "0.1.21",
"svelte": "^3.46.4",
"typescript": "^4.9.5", "typescript": "^4.9.5",
"vitest": "^0.9.3", "vitest": "^0.9.3",
"vitest-svelte-kit": "^0.0.6" "vitest-svelte-kit": "^0.0.6"
}, },
"dependencies": { "dependencies": {
"@reduxjs/toolkit": "^1.9.3", "@reduxjs/toolkit": "^1.9.3",
"@storybook/addon-essentials": "^6.4.19",
"@storybook/addon-svelte-csf": "^1.1.0",
"@storybook/svelte": "^6.4.21",
"@sveltejs/adapter-node": "^1.0.0-next.0", "@sveltejs/adapter-node": "^1.0.0-next.0",
"@yanick/updeep-remeda": "^2.1.0", "@yanick/updeep-remeda": "^2.1.0",
"chota": "^0.8.0", "chota": "^0.8.0",
@ -46,13 +37,11 @@
"redux": "^4.1.2", "redux": "^4.1.2",
"remeda": "^1.1.0", "remeda": "^1.1.0",
"reselect": "^4.1.5", "reselect": "^4.1.5",
"rollup-plugin-analyzer": "^4.0.0",
"svelte-chota": "^1.8.6", "svelte-chota": "^1.8.6",
"svelte-knobby": "^0.3.4", "svelte-knobby": "^0.3.4",
"svelte-moveable": "^0.20.0", "svelte-moveable": "^0.20.0",
"ts-action": "^11.0.0", "ts-action": "^11.0.0",
"updux": "link:/home/yanick/work/javascript/updux-js/", "vite": "^4.1.4"
"webpack": "5"
}, },
"prettier": { "prettier": {
"svelteSortOrder": "options-markup-scripts-styles", "svelteSortOrder": "options-markup-scripts-styles",

4
src/app.html
View File

@ -4,9 +4,9 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
%svelte.head% %sveltekit.head%
</head> </head>
<body> <body>
<div id="svelte">%svelte.body%</div> <div id="svelte">%sveltekit.body%</div>
</body> </body>
</html> </html>

5
src/lib/components/ShipEdit/Carrier/Squadron.svelte
View File

@ -14,7 +14,7 @@
import Section from "$lib/components/Section/index.svelte"; import Section from "$lib/components/Section/index.svelte";
import Field from "$lib/components/Field/index.svelte"; import Field from "$lib/components/Field/index.svelte";
import ShipItem from "$lib/components/ShipItem/index.svelte"; import ShipItem from "$lib/components/ShipItem/index.svelte";
import { squadronTypes } from "$lib/shipDux/carrier.js"; import { squadronTypes } from "$lib/shipDux/carrier";
const types = squadronTypes.map(({ type }) => type); const types = squadronTypes.map(({ type }) => type);
@ -24,9 +24,8 @@
export let { dispatch } = getContext("ship"); export let { dispatch } = getContext("ship");
$: console.log(type) $: console.log(type);
$: dispatch.setSquadronType({ type, id }); $: dispatch.setSquadronType({ type, id });
</script> </script>
<style> <style>

2
src/lib/components/ShipEdit/Weaponry/AddWeapon.svelte
View File

@ -12,7 +12,7 @@
import { getContext } from "svelte"; import { getContext } from "svelte";
import Field from "../../Field/index.svelte"; import Field from "../../Field/index.svelte";
import { weaponTypes } from '$lib/shipDux/weaponry/weapons.js'; import { weaponTypes } from "$lib/shipDux/weaponry/weapons";
export let ship = getContext("ship"); export let ship = getContext("ship");

2
src/lib/shipDux/carrier.ts
View File

@ -12,7 +12,7 @@ const initialState = {
reqs, reqs,
}; };
export const carrierSlice = createSlice({ export const { actions, reducer } = createSlice({
name: "carrier", name: "carrier",
initialState, initialState,
reducers: { reducers: {

10
src/lib/shipDux/index.test.ts Normal file
View File

@ -0,0 +1,10 @@
import { createStore } from "./index.js";
test("basic, initial store", () => {
const store = createStore();
const state = store.getState();
expect(state).toHaveProperty("propulsion.drive.reqs.mass", 0);
expect(state).toHaveProperty("structure.cargo.space", 0);
});

58
src/lib/shipDux/index.ts
View File

@ -1,3 +1,37 @@
import { combineReducers, configureStore, createSlice } from "@reduxjs/toolkit";
import R from "remeda";
import * as propulsion from "./propulsion";
import * as structure from "./structure";
import * as weaponry from "./weaponry/index.js";
import * as carrier from "./carrier";
const shipSlice = createSlice({
name: "ship",
initialState: {},
reducers: {},
extraReducers(builder) {
builder.addMatcher(
() => true,
combineReducers({
propulsion: propulsion.reducer,
structure: structure.reducer,
weaponry: weaponry.reducer,
carrier: carrier.reducer,
})
);
},
});
export function createStore() {
return configureStore({
reducer: shipSlice.reducer,
});
}
export const actions = shipSlice.actions;
/**
import * as propulsion from "./propulsion/index.js"; import * as propulsion from "./propulsion/index.js";
import * as identification from "./identification.js"; import * as identification from "./identification.js";
import { calculateDriveReqs } from "./propulsion/drive.js"; import { calculateDriveReqs } from "./propulsion/drive.js";
@ -5,7 +39,27 @@ import { ftlReqsReaction } from "./propulsion/ftl.js";
import * as structure from "./structure/index.js"; import * as structure from "./structure/index.js";
import * as carrier from "./carrier.js"; import * as carrier from "./carrier.js";
import * as weaponry from "./weaponry/index.js"; import * as weaponry from "./weaponry/index.js";
import * as shipReqs from "./shipReqs.js";
import { screensReqsReaction } from "./structure/screens.js"; import { screensReqsReaction } from "./structure/screens.js";
import { createSlice } from "@reduxjs/toolkit";
const initialState = {
propulsion: propulsion.initialState,
identification: identification.initialState,
structure: structure.initialState,
carrier: carrier.initialState,
weaponry: weaponry.initialState,
shipReqs: shipReqs.initialState,
}
const shipSlice = createSlice({
name: "ship",
),
});
const dux = new Updux({ const dux = new Updux({
subduxes: { subduxes: {
@ -39,9 +93,6 @@ dux.setMutation("resetShip", () => () => dux.initial);
dux.setMutation("resetLayout", () => resetUITransform); dux.setMutation("resetLayout", () => resetUITransform);
dux.setMutation("setShipMass", (mass) => u({ reqs: { mass } }));
dux.setMutation("setShipReqs", (reqs) => u({ reqs }));
dux.setMutation("setUITransform", ({ system, systemId, translate }) => { dux.setMutation("setUITransform", ({ system, systemId, translate }) => {
const transform = translate const transform = translate
? `translate(${translate[0]}px,${translate[1]}px)` ? `translate(${translate[0]}px,${translate[1]}px)`
@ -104,3 +155,4 @@ dux.addReaction((store) => (state) => {
}); });
export default dux; export default dux;
*/

2
src/lib/shipDux/propulsion/drive.ts
View File

@ -6,7 +6,7 @@ type DriveProps = {
advanced: boolean; advanced: boolean;
}; };
const initialState: DriveProps & { reqs: Reqs } = { export const initialState: DriveProps & { reqs: Reqs } = {
rating: 0, rating: 0,
advanced: false, advanced: false,
reqs, reqs,

2
src/lib/shipDux/propulsion/ftl.ts
View File

@ -8,7 +8,7 @@ import { reqs, Reqs } from "../reqs.js";
export const ftlTypes = ["none", "standard", "advanced"] as const; export const ftlTypes = ["none", "standard", "advanced"] as const;
type FtlType = typeof ftlTypes[number]; type FtlType = typeof ftlTypes[number];
const initialState = { export const initialState = {
reqs, reqs,
type: "none" as FtlType, type: "none" as FtlType,
}; };

5
src/lib/shipDux/propulsion/index.ts
View File

@ -6,3 +6,8 @@ export const reducer = combineReducers({
drive: drive.reducer, drive: drive.reducer,
ftl: ftl.reducer, ftl: ftl.reducer,
}); });
export const initialState = {
drive: drive.initialState,
ftl: ftl.initialState,
};

1
src/lib/shipDux/ship.test.ts Normal file
View File

@ -0,0 +1 @@
import

24
src/lib/shipDux/shipReqs.ts Normal file
View File

@ -0,0 +1,24 @@
import { createSlice } from "@reduxjs/toolkit";
import { reqs } from "./reqs";
const initialState = {
usedMass: 0,
mass: 10,
cost: 0,
};
const shipReqs = createSlice({
name: "shipReqs",
initialState,
reducers: {
setShipMass(state, action) {
state.mass = action.payload;
},
setShipReqs(state, action) {
return {
...state,
...action.payload,
};
},
},
});

2
src/lib/shipDux/structure/armor.ts
View File

@ -24,6 +24,8 @@ const armor = createSlice({
}, },
}); });
export const { actions, reducer } = armor;
function calcArmorReqs(layers: Layer[]): Reqs { function calcArmorReqs(layers: Layer[]): Reqs {
const mass = 2 * layers.reduce((a, b) => a + b, 0); const mass = 2 * layers.reduce((a, b) => a + b, 0);
const cost = 2 * layers.map((v, k) => v * (k + 1)).reduce((a, b) => a + b, 0); const cost = 2 * layers.map((v, k) => v * (k + 1)).reduce((a, b) => a + b, 0);

3
src/lib/shipDux/structure/hull.ts
View File

@ -17,7 +17,7 @@ const hull = createSlice({
state.reqs = { state.reqs = {
mass: action.payload, mass: action.payload,
cost: 2 * action.payload, cost: 2 * action.payload,
} };
}, },
setShipMass: (state, action: PayloadAction<number>) => { setShipMass: (state, action: PayloadAction<number>) => {
const mass = action.payload; const mass = action.payload;
@ -26,7 +26,6 @@ const hull = createSlice({
state.min = Math.ceil(mass / 10); state.min = Math.ceil(mass / 10);
if (state.rating < state.min) state.rating = state.min; if (state.rating < state.min) state.rating = state.min;
state.max = mass; state.max = mass;
};
}, },
}, },
}); });

2
src/lib/shipDux/structure/index.ts
View File

@ -2,7 +2,7 @@ import { combineReducers } from "redux";
import * as R from "remeda"; import * as R from "remeda";
import * as hull from "./hull.js"; import * as hull from "./hull.js";
import * as screens from "./screens.js"; import * as screens from "./screen.js";
import * as cargo from "./cargo.js"; import * as cargo from "./cargo.js";
import * as armor from "./armor.js"; import * as armor from "./armor.js";
import * as streamlining from "./streamlining.js"; import * as streamlining from "./streamlining.js";

4
src/lib/store/ship.js
View File

@ -1,8 +1,8 @@
import { browser, dev } from "$app/env"; import { browser, dev } from "$app/environment";
import { readable, get, derived } from "svelte/store"; import { readable, get, derived } from "svelte/store";
import { compose, applyMiddleware } from "redux"; import { compose, applyMiddleware } from "redux";
import shipDux from "../shipDux/index.js"; import shipDux from "../shipDux/index";
import { initial } from "lodash"; import { initial } from "lodash";
let composeEnhancers = compose; let composeEnhancers = compose;

2
src/routes/index.svelte → src/routes/+page.svelte
View File

@ -3,7 +3,7 @@
<script> <script>
import { setContext } from "svelte"; import { setContext } from "svelte";
import '$lib/style/index.js'; import "$lib/style/index.js";
import shipStore from "$lib/store/ship.js"; import shipStore from "$lib/store/ship.js";
import App from "$lib/components/App.svelte"; import App from "$lib/components/App.svelte";

26
svelte.config.js
View File

@ -1,24 +1,8 @@
import adapter from "@sveltejs/adapter-static"; import preprocess from "svelte-preprocess";
import analyze from "rollup-plugin-analyzer";
const dev = process.env.NODE_ENV === "development";
/** @type {import('@sveltejs/kit').Config} */ /** @type {import('@sveltejs/kit').Config} */
export default { const config = {
kit: { preprocess: preprocess(),
adapter: adapter({ fallback: "index.html" }),
paths: { base: dev ? "" : "/aotds-docks" },
vite: {
define: {
"import.meta.env.PACKAGE_VERSION": JSON.stringify(
process.env.npm_package_version
),
},
build: {
rollupOptions: {
plugins: [analyze()],
// external: ['updux','@yanick/updeep']
},
},
},
},
}; };
export default config;

1
tsconfig.json
View File

@ -1,4 +1,5 @@
{ {
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": { "compilerOptions": {
/* Visit https://aka.ms/tsconfig to read more about this file */ /* Visit https://aka.ms/tsconfig to read more about this file */

12
vite.config.js Normal file
View File

@ -0,0 +1,12 @@
// vite.config.js
import { sveltekit } from "@sveltejs/kit/vite";
/** @type {import('vite').UserConfig} */
const config = {
plugins: [sveltekit()],
ssr: {},
optimizeDeps: {},
};
export default config;