diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index c90f7538..fa4ca6d1 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -9,14 +9,14 @@ jobs: name: Prepare Cache runs-on: ubuntu-latest steps: - - uses: actions/checkout@v2 + - uses: actions/checkout@v3 - uses: actions/setup-node@v3 with: node-version: "16.14.2" - name: Get yarn cache directory path id: yarn-cache-dir-path run: echo "::set-output name=dir::$(yarn config get cacheFolder)" - - uses: actions/cache@v2 + - uses: actions/cache@v3 id: yarn-cache with: path: ${{ steps.yarn-cache-dir-path.outputs.dir }} @@ -38,14 +38,14 @@ jobs: runs-on: ubuntu-latest needs: prepare-yarn-cache steps: - - uses: actions/checkout@v2 - - uses: actions/setup-node@v2-beta + - uses: actions/checkout@v3 + - uses: actions/setup-node@v3 with: - node-version: "*" + node-version: "16" - name: Get yarn cache directory path id: yarn-cache-dir-path run: echo "::set-output name=dir::$(yarn config get cacheFolder)" - - uses: actions/cache@v2 + - uses: actions/cache@v3 with: path: ${{ steps.yarn-cache-dir-path.outputs.dir }} key: yarn-${{ hashFiles('yarn.lock') }} diff --git a/.github/workflows/codeql-analysis.yml b/.github/workflows/codeql-analysis.yml index 30b426a3..5482f731 100644 --- a/.github/workflows/codeql-analysis.yml +++ b/.github/workflows/codeql-analysis.yml @@ -43,7 +43,7 @@ jobs: # Initializes the CodeQL tools for scanning. - name: Initialize CodeQL - uses: github/codeql-action/init@v1 + uses: github/codeql-action/init@v2 with: languages: ${{ matrix.language }} # If you wish to specify custom queries, you can do so here or in a config file. @@ -54,7 +54,7 @@ jobs: # Autobuild attempts to build any compiled languages (C/C++, C#, or Java). # If this step fails, then you should remove it and run the build manually (see below) - name: Autobuild - uses: github/codeql-action/autobuild@v1 + uses: github/codeql-action/autobuild@v2 # ℹ️ Command-line programs to run using the OS shell. # 📚 https://git.io/JvXDl @@ -68,4 +68,4 @@ jobs: # make release - name: Perform CodeQL Analysis - uses: github/codeql-action/analyze@v1 + uses: github/codeql-action/analyze@v2 diff --git a/.github/workflows/documentation.yml b/.github/workflows/documentation.yml index eb5e2719..f7302824 100644 --- a/.github/workflows/documentation.yml +++ b/.github/workflows/documentation.yml @@ -8,7 +8,7 @@ jobs: documentation: runs-on: ubuntu-latest steps: - - uses: actions/checkout@v2 + - uses: actions/checkout@v3 - uses: actions/setup-node@v3 with: node-version: "16.14.2" diff --git a/CHANGELOG.md b/CHANGELOG.md index 081925fe..c60e93e7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,40 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [4.0.0-alpha.119](https://github.com/code11/engine/compare/v4.0.0-alpha.118...v4.0.0-alpha.119) (2023-02-06) + + +### Bug Fixes + +* ensure react 17 works; update template-react ([b94d476](https://github.com/code11/engine/commit/b94d4761ecf0aeb8b7fa02e1c030b3948dae139f)) + + + + + +# [4.0.0-alpha.118](https://github.com/code11/engine/compare/v4.0.0-alpha.117...v4.0.0-alpha.118) (2023-01-31) + + +### Features + +* **engine.template-react-app:** base setup ([475500e](https://github.com/code11/engine/commit/475500e55f03f48907f19881429cf35c04d09af5)) +* **use-react-18:** updated react version to 18, replace React.render with createRoot().render ([ad58002](https://github.com/code11/engine/commit/ad58002120dc0469e587e6264469a3df7d171ee9)) + + + + + +# [4.0.0-alpha.117](https://github.com/code11/engine/compare/v4.0.0-alpha.116...v4.0.0-alpha.117) (2022-10-20) + + +### Features + +* add support for refining syntax (get) ([#134](https://github.com/code11/engine/issues/134)) ([a83ebe1](https://github.com/code11/engine/commit/a83ebe1a8760571e977fe43d9c5b6e9bf7a83954)) + + + + + # [4.0.0-alpha.116](https://github.com/code11/engine/compare/v4.0.0-alpha.115...v4.0.0-alpha.116) (2022-10-03) **Note:** Version bump only for package engine diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 72c17408..d1f8d1c9 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -3,6 +3,25 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [4.0.0-alpha.118](https://github.com/code11/engine/compare/v4.0.0-alpha.117...v4.0.0-alpha.118) (2023-01-31) + + +### Features + +* **use-react-18:** updated react version to 18, replace React.render with createRoot().render ([ad58002](https://github.com/code11/engine/commit/ad58002120dc0469e587e6264469a3df7d171ee9)) + + + + + +# [4.0.0-alpha.117](https://github.com/code11/engine/compare/v4.0.0-alpha.116...v4.0.0-alpha.117) (2022-10-20) + +**Note:** Version bump only for package docs + + + + + # [4.0.0-alpha.116](https://github.com/code11/engine/compare/v4.0.0-alpha.115...v4.0.0-alpha.116) (2022-10-03) **Note:** Version bump only for package docs diff --git a/docs/docs/api/get.md b/docs/docs/api/get.md index 28bc9ffd..bad1e050 100644 --- a/docs/docs/api/get.md +++ b/docs/docs/api/get.md @@ -4,26 +4,29 @@ title: get sidebar_label: get --- -## Overview +`get.` retrieve values from the state without adding a listener. -`get` provides the ability to get values from the global state at a later time, -after the `view` or `producer` was triggered. It works the same way as -[observe](/docs/api/observe), except: +It should be used for data that is required during execution but that does not trigger the execution (as opposed to [observe](/docs/api/observe)). -1. `get` don't provide a value, but instead an api for that path which can be used at - any time in future to get the latest value form state -2. `get` don't cause `view`s and `producer`s to get triggered +A `get` can be **lazy** or **eager** depending on whether the value should be available at the moment when the execution starts or at a later point in time. -`get` is ideal when: - -1. A value is needed to do a computation in a `producer`, but the producer - should not get triggered when this value changes -2. A value is needed at a later time since producer was triggered, e.g while - performing an asynchronous operation +A **lazy** `get` will return an API through which values can be retrieved and an **eager** `get` will provide the values when the execution starts. +Example: +```ts +const doSomeWork: producer = ({ + eager = get.foo.bar.value(), + lazy = get.foo.bar +}) => { + eager; // [1, 2, 3] + setTimeout(() => { + lazy.value(); // [1, 2, 3] + }, 1000); +} +``` ## API -`get.` returns an object with following properties: +A **lazy** `get.` returns an object with following properties: 1. `.value(params?: object)` returns the date stored at that `` `params` is an optional object argument, the keys of which set the @@ -38,27 +41,28 @@ Javascript type, a plain object), a copy of the data is returned. However, if the data is not serializable (e.g a class instance, function etc), a reference to it is returned. -## Example +## Best practices -For example, if the state looks like: +1. Use more `gets` than `observes` in producers. -```json -{ - "foo": { - "bar": "baz" - } -} -``` + Producers should have a very narrow window for triggering and the `observe` should be reserved for the triggering specificity. When you can't justify that some data determines the triggering then that data should be retrieved using a `get`. -The value of `bar` can be accessed by assigning `get.foo.bar` in header of a -[view](/docs/api/view) or [producer](/docs/api/producer), and calling it later -e.g +2. `views` should not use `get`. -``` -const doSomeWork: producer = ({ getBar = get.foo.bar }) => { - const var = getBar.value(); // provides lates value of bar, and does not trigger if bar ever changes -} -``` + Views should be completely reactive and always rely on fresh data to re-render. + + The only valid exception is regarding handling a user event (like a `click`) + which is outside rendering. + ```ts + // DON'T DO THIS! + const a: view = ({ a = get.a }) =>
{a.value()}
+ + // DON"T DO THIS! + const b: view = ({ a = get.a.value() }) =>
{a}
+ + // ONLY VALID USE CASE + const c: view = ({ a = get.a }) =>