feat: store plugin (#431)

* feat: app store * chore: store example * chore: lock * feat: init page store * feat: update page store * fix: disable reset page state * feat: createModel * test: with-store test * fix: comment * chore: lock
ice-lab · Aug 10, 2022 · 45dc7a8 · 45dc7a8 · vercel · Aug 10, 2022
1 parent ca2b7f6
commit 45dc7a8
Show file tree

Hide file tree

Showing 30 changed files with 585 additions and 2 deletions.
diff --git a/examples/with-store/ice.config.mts b/examples/with-store/ice.config.mts
@@ -0,0 +1,8 @@
+import { defineConfig } from '@ice/app';
+import store from '@ice/plugin-store';
+
+export default defineConfig({
+  plugins: [
+    store(),
+  ],
+});
diff --git a/examples/with-store/package.json b/examples/with-store/package.json
@@ -0,0 +1,21 @@
+{
+  "name": "with-store",
+  "private": true,
+  "version": "1.0.0",
+  "scripts": {
+    "start": "ice start",
+    "build": "ice build"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "@ice/app": "workspace:*",
+    "@ice/runtime": "workspace:*"
+  },
+  "devDependencies": {
+    "@ice/plugin-store": "workspace:*",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "browserslist": "^4.19.3",
+    "regenerator-runtime": "^0.13.9"
+  }
+}
diff --git a/examples/with-store/public/favicon.ico b/examples/with-store/public/favicon.ico
diff --git a/examples/with-store/src/app.tsx b/examples/with-store/src/app.tsx
@@ -0,0 +1,3 @@
+import { defineAppConfig } from 'ice';
+
+export default defineAppConfig({});
diff --git a/examples/with-store/src/document.tsx b/examples/with-store/src/document.tsx
@@ -0,0 +1,23 @@
+import { Meta, Title, Links, Main, Scripts } from 'ice';
+
+function Document() {
+  return (
+    <html>
+      <head>
+        <meta charSet="utf-8" />
+        <link rel="icon" href="/favicon.ico" />
+        <meta name="description" content="with-store" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <Meta />
+        <Title />
+        <Links />
+      </head>
+      <body>
+        <Main />
+        <Scripts />
+      </body>
+    </html>
+  );
+}
+
+export default Document;
diff --git a/examples/with-store/src/models/user.ts b/examples/with-store/src/models/user.ts
@@ -0,0 +1,7 @@
+import { createModel } from '@ice/plugin-store/esm/runtime';
+
+export default createModel({
+  state: {
+    name: 'ICE 3',
+  },
+});
diff --git a/examples/with-store/src/pages/blog/first-post.tsx b/examples/with-store/src/pages/blog/first-post.tsx
@@ -0,0 +1,17 @@
+import { Link } from 'ice';
+import pageStore from './store';
+
+function FirstPost() {
+  const [infoState] = pageStore.useModel('info');
+
+  return (
+    <>
+      <article>
+        <h2>{infoState.posts[0].title}</h2>
+      </article>
+      <div><Link to="/blog">Back</Link></div>
+    </>
+  );
+}
+
+export default FirstPost;
diff --git a/examples/with-store/src/pages/blog/index.tsx b/examples/with-store/src/pages/blog/index.tsx
@@ -0,0 +1,20 @@
+import { Link } from 'ice';
+import pageStore from './store';
+
+function Blog() {
+  const [infoState] = pageStore.useModel('info');
+
+  return (
+    <div>
+      Blog Count: {infoState.posts.length}
+      <ul>
+        {infoState.posts.map(({ title, id }) => {
+          return <Link to={id} key={id}><li>{title}</li></Link>;
+        })}
+      </ul>
+      <Link to="/">Home</Link>
+    </div>
+  );
+}
+
+export default Blog;
diff --git a/examples/with-store/src/pages/blog/layout.tsx b/examples/with-store/src/pages/blog/layout.tsx
@@ -0,0 +1,14 @@
+import { Outlet } from 'ice';
+import store from './store';
+
+function layout() {
+  const [infoState] = store.useModel('info');
+  return (
+    <>
+      <h1>{infoState.title}</h1>
+      <Outlet />
+    </>
+  );
+}
+
+export default layout;
diff --git a/examples/with-store/src/pages/blog/models/info.ts b/examples/with-store/src/pages/blog/models/info.ts
@@ -0,0 +1,10 @@
+import { createModel } from '@ice/plugin-store/esm/runtime';
+
+export default createModel({
+  state: {
+    title: 'ICE Blog',
+    posts: [
+      { title: 'First Post', id: 'first-post' },
+    ],
+  },
+});
diff --git a/examples/with-store/src/pages/blog/store.ts b/examples/with-store/src/pages/blog/store.ts
@@ -0,0 +1,4 @@
+import { createStore } from '@ice/plugin-store/esm/runtime';
+import info from './models/info';
+
+export default createStore({ info });
diff --git a/examples/with-store/src/pages/index.tsx b/examples/with-store/src/pages/index.tsx
@@ -0,0 +1,24 @@
+import { Link } from 'ice';
+import pageStore from './store';
+import appStore from '@/store';
+
+function Home() {
+  const [userState] = appStore.useModel('user');
+  const [countState, countDispatcher] = pageStore.useModel('counter');
+  return (
+    <>
+      <div id="username">
+        name: {userState.name}
+      </div>
+      <div>
+        <button type="button" id="inc" onClick={() => countDispatcher.inc()}>+</button>
+        <span id="count">{countState.count}</span>
+        <button type="button" id="dec" onClick={() => countDispatcher.dec()}>-</button>
+      </div>
+      <Link to="/blog">Blog</Link>
+    </>
+  );
+}
+
+
+export default Home;
diff --git a/examples/with-store/src/pages/models/counter.ts b/examples/with-store/src/pages/models/counter.ts
@@ -0,0 +1,15 @@
+import { createModel } from '@ice/plugin-store/esm/runtime';
+
+export default createModel({
+  state: {
+    count: 0,
+  },
+  reducers: {
+    inc(prevState, count = 1) {
+      prevState.count += count;
+    },
+    dec(prevState, count = 1) {
+      prevState.count -= count;
+    },
+  },
+});
diff --git a/examples/with-store/src/pages/store.ts b/examples/with-store/src/pages/store.ts
@@ -0,0 +1,6 @@
+import { createStore } from '@ice/plugin-store/esm/runtime';
+import counter from './models/counter';
+
+const store = createStore({ counter });
+
+export default store;
diff --git a/examples/with-store/src/store.ts b/examples/with-store/src/store.ts
@@ -0,0 +1,4 @@
+import { createStore } from '@ice/plugin-store/esm/runtime';
+import user from './models/user';
+
+export default createStore({ user });
diff --git a/examples/with-store/tsconfig.json b/examples/with-store/tsconfig.json
@@ -0,0 +1,32 @@
+{
+  "compileOnSave": false,
+  "buildOnSave": false,
+  "compilerOptions": {
+    "baseUrl": ".",
+    "outDir": "build",
+    "module": "esnext",
+    "target": "es6",
+    "jsx": "react-jsx",
+    "moduleResolution": "node",
+    "allowSyntheticDefaultImports": true,
+    "lib": ["es6", "dom"],
+    "sourceMap": true,
+    "allowJs": true,
+    "rootDir": "./",
+    "forceConsistentCasingInFileNames": true,
+    "noImplicitReturns": true,
+    "noImplicitThis": true,
+    "noImplicitAny": false,
+    "importHelpers": true,
+    "strictNullChecks": true,
+    "suppressImplicitAnyIndexErrors": true,
+    "noUnusedLocals": true,
+    "skipLibCheck": true,
+    "paths": {
+      "@/*": ["./src/*"],
+      "ice": [".ice"]
+    }
+  },
+  "include": ["src", ".ice", "ice.config.*"],
+  "exclude": ["node_modules", "build", "public"]
+}
diff --git a/packages/plugin-store/CHANGELOG.md b/packages/plugin-store/CHANGELOG.md
@@ -0,0 +1,5 @@
+# CHANGELOG
+
+## 1.0.0
+
+- feat: init plugin store
diff --git a/packages/plugin-store/README.md b/packages/plugin-store/README.md
diff --git a/packages/plugin-store/package.json b/packages/plugin-store/package.json
@@ -0,0 +1,54 @@
+{
+  "name": "@ice/plugin-store",
+  "version": "1.0.0",
+  "description": "",
+  "license": "MIT",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./esm/index.d.ts",
+      "import": "./esm/index.js",
+      "default": "./esm/index.js"
+    },
+    "./runtime": {
+      "types": "./esm/runtime.d.ts",
+      "import": "./esm/runtime.js",
+      "default": "./esm/runtime.js"
+    },
+    "./esm/runtime": {
+      "types": "./esm/runtime.d.ts",
+      "import": "./esm/runtime.js",
+      "default": "./esm/runtime.js"
+    }
+  },
+  "main": "./esm/index.js",
+  "types": "./esm/index.d.ts",
+  "files": [
+    "esm",
+    "!esm/**/*.map"
+  ],
+  "dependencies": {
+    "@ice/store": "^2.0.1",
+    "fast-glob": "^3.2.11",
+    "micromatch": "^4.0.5"
+  },
+  "devDependencies": {
+    "@ice/types": "^1.0.0",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "@types/micromatch": "^4.0.2",
+    "regenerator-runtime": "^0.13.9"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0"
+  },
+  "repository": {
+    "type": "http",
+    "url": "https://github.com/ice-lab/ice-next/tree/master/packages/plugin-store"
+  },
+  "scripts": {
+    "watch": "tsc -w",
+    "build": "tsc"
+  }
+}
diff --git a/packages/plugin-store/src/_store.ts b/packages/plugin-store/src/_store.ts
@@ -0,0 +1,10 @@
+import type { IcestoreDispatch, IcestoreRootState } from '@ice/store';
+import { createStore } from '@ice/store';
+
+const models = {};
+
+const store = createStore(models);
+
+export default store;
+export type IRootDispatch = IcestoreDispatch<typeof models>;
+export type IRootState = IcestoreRootState<typeof models>;
diff --git a/packages/plugin-store/src/constants.ts b/packages/plugin-store/src/constants.ts
@@ -0,0 +1,3 @@
+export const PAGE_STORE_MODULE = '__PAGE_STORE__';
+export const PAGE_STORE_PROVIDER = '__PAGE_STORE_PROVIDER__';
+export const PAGE_STORE_INITIAL_STATES = '__PAGE_STORE_INITIAL_STATES__';
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import { defineAppConfig } from 'ice';

		export default defineAppConfig({});