Skip to content
This repository was archived by the owner on Feb 15, 2025. It is now read-only.

Commit 85a6feb

Browse files
bennobuilderbennobuilder
authored
Merge pull request #94 from agile-ts/develop
Updated Algolia Config
2 parents 2ac04cc + bc0bd9a commit 85a6feb

File tree

30 files changed

+3534
-2045
lines changed

30 files changed

+3534
-2045
lines changed

‎docs/Interfaces.md

+5-2
Original file line numberDiff line numberDiff line change
@@ -303,8 +303,11 @@ Here is a Typescript Interface for quick reference. However,
303303
each property is explained in more detail below.
304304
```ts
305305
export interface StatePersistentConfigInterface {
306+
key?: string | number;
306307
loadValue?: boolean;
307308
storageKeys?: StorageKey[];
309+
onMigrate?: (value: any) => ValueType;
310+
onSave?: (value: ValueType) => any;
308311
}
309312
```
310313

@@ -317,12 +320,12 @@ Or, if the State isn't persisted yet, it stores the State value in the correspon
317320
Be aware that if we don't allow the `Persistent` to load/store the value, we have to do it ourselves.
318321
```ts {2}
319322
myState.persist({
320-
instantiate: false,
323+
loadValue: false,
321324
});
322325

323326
if (myState.persistent?.ready) {
324327
await myState.persistent?.initialLoading();
325-
myState.isPersisted = true;
328+
myState.isPersisted = true;
326329
}
327330
```
328331
Loading the value manually has one advantage.

‎docs/main/Contributing.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
id: contributing
3-
title: Contributing
4-
sidebar_label: Contributing to AgileTs
3+
title: Contributing to AgileTs
4+
sidebar_label: Contributing
55
slug: /contributing
66
description: Contributions to AgileTs are not hard and very welcome.
77
image: img/meta.png

‎docs/main/Introduction.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,18 @@
22
id: introduction
33
title: Introducing AgileTs
44
sidebar_label: Introduction
5-
slug: /introduction/
6-
description: A global State and Logic Library implemented in Typescript, offering a reimagined API that focuses on developer experience. The AgileTs state management functionality can be used in various frameworks like React, Vue and plain Javascript.
5+
slug: /introduction
6+
description: An atom based global State and Logic Library implemented in Typescript, offering a reimagined API that focuses on developer experience. The AgileTs state management functionality can be used in various frameworks like React, Vue and plain Javascript.
77
image: img/meta.png
88
---
99

1010
## 👋 Introduction {#introduction}
1111

12-
AgileTs is a global State and Logic Library implemented in Typescript.
12+
AgileTs is an atom based global State and Logic Library implemented in Typescript.
1313
It offers a reimagined API that focuses on **developer experience**
1414
and allows you to **easily** and **flexible** manage your application States.
1515
Besides [States](../packages/core/api/state/Introduction.md),
16-
AgileTs offers some other powerful and tree shakable APIs that make your life easier,
16+
AgileTs offers some other powerful APIs that make your life easier,
1717
such as [Collections](../packages/core/api/collection/Introduction.md)
1818
and [Computed States](../packages/core/api/computed/Introduction.md).
1919
The philosophy behind AgileTs is simple:
@@ -35,7 +35,7 @@ MY_STATE.undo();
3535
MY_STATE.reset();
3636

3737
// Permanently store the State value in an external Storage
38-
MY_STATE.persist("storage-key");
38+
MY_STATE.persist({key: "storage-key"});
3939
```
4040

4141
### 🤸‍ Flexible {#flexible}

‎docs/main/StyleGuides.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -382,13 +382,13 @@ and mutate its entities as wished without further thinking.
382382
For example when we want to add a Todo-Item to the TODO Collection
383383
we simply call `core.todo.addTodo(/* new todo */);`.
384384
```ts title="index.ts"
385-
import todo from "./controllers/todo";
386-
import user from "./controllers/user";
385+
import todo from "./entities/todo";
386+
import user from "./entities/user";
387387
import {globalBind} from "@agile-ts/core";
388388

389389
const core = {
390-
todo: todo,
391-
user: user,
390+
todo,
391+
user,
392392
};
393393

394394
// For better debugging we bind the core globally

‎docs/packages/api/Introduction.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ slug: /api
1010
<a href="https://npm.im/@agile-ts/api">
1111
<img src="https://img.shields.io/npm/v/@agile-ts/api.svg?label=npm&style=flat&colorA=293140&colorB=4a4872" alt="npm version"/></a>
1212
<a href="https://npm.im/@agile-ts/api">
13-
<img src="https://img.shields.io/bundlephobia/min/@agile-ts/api.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
13+
<img src="https://img.shields.io/bundlephobia/minzip/@agile-ts/api.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
1414
<a href="https://npm.im/@agile-ts/api">
1515
<img src="https://img.shields.io/npm/dt/@agile-ts/api.svg?label=downloads&style=flat&colorA=293140&colorB=4a4872" alt="npm total downloads"/></a>
1616

‎docs/packages/core/Introduction.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ slug: /core
1010
<a href="https://npm.im/@agile-ts/core">
1111
<img src="https://img.shields.io/npm/v/@agile-ts/core.svg?label=npm&style=flat&colorA=293140&colorB=4a4872" alt="npm version"/></a>
1212
<a href="https://npm.im/@agile-ts/core">
13-
<img src="https://img.shields.io/bundlephobia/min/@agile-ts/core.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
13+
<img src="https://img.shields.io/bundlephobia/minzip/@agile-ts/core.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
1414
<a href="https://npm.im/@agile-ts/core">
1515
<img src="https://img.shields.io/npm/dt/@agile-ts/core.svg?label=downloads&style=flat&colorA=293140&colorB=4a4872" alt="npm total downloads"/></a>
1616

‎docs/packages/core/api/state/Methods.md

+1-2
Original file line numberDiff line numberDiff line change
@@ -495,7 +495,7 @@ Returns the [State](./Introduction.md) it was called on.
495495

496496
Preserves the State `value` in the appropriate local Storage for the current environment.
497497
```ts
498-
MY_STATE.perist("myStorageKey");
498+
MY_STATE.perist({key: "myStorageKey"});
499499
```
500500

501501
### 🤓 Learn more
@@ -507,7 +507,6 @@ checkout the [Persisting Data](../storage/PersistingData.md) Section.
507507

508508
| Prop | Type | Default | Description | Required |
509509
|----------------------|----------------------------------------------------------------------------|------------|---------------------------------------------------------------------------------------|----------|
510-
| `key` | string \| number | undefined | Key/Name of created Persistent (Note: Key is required if State has no set Key!) | No |
511510
| `config` | [StatePersistentConfig](../../../../Interfaces.md#statepersistentconfig) | {} | Configuration | No |
512511

513512
### 📄 Return

‎docs/packages/core/api/storage/Introduction.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -202,10 +202,10 @@ The prefix will be added before each `Storage Key`
202202
and is intended to highlight the items stored by AgileTs.
203203
A `Storage Key` identifies the stored value in the corresponding Storage.
204204
```ts
205-
MY_STATE.persist('myState');
205+
MY_STATE.persist({key: 'myState'});
206206
// Storage Key: '_prefix_myState'
207207
208-
MY_COLLECTION.persist('myCollection');
208+
MY_COLLECTION.persist({key: 'myCollection'});
209209
// Storage Keys:
210210
// Collection Indicator: '_prefix_myCollection'
211211
// Default Group: '_prefix__myCollection_group_default'

‎docs/packages/core/api/storage/PersistingData.md

+33-5
Original file line numberDiff line numberDiff line change
@@ -8,20 +8,20 @@ slug: /core/persisting-data
88
It's common for applications to store data on the client browser.
99
AgileTs makes it pretty easy to achieve such goal.
1010
```ts
11-
MY_STATE.persist('storage-key-here');
11+
MY_STATE.persist({key: 'storage-key-here'});
1212
```
1313
Besides [States](../state/Introduction.md), we can persist nearly any [Agile Sub Instance](../../../../main/Introduction.md#agile-sub-instance).
1414
- [Collections](../collection/Introduction.md)
1515
```ts
16-
MY_COLLECTION.persist('storage-key-here');
16+
MY_COLLECTION.persist({key: 'storage-key-here'});
1717
```
1818
- [Selectors](../collection/selector/Introduction.md)
1919
```ts
20-
MY_SELECTOR.persist('storage-key-here');
20+
MY_SELECTOR.persist({key: 'storage-key-here'});
2121
```
2222
- [Groups](../collection/group/Introduction.md)
2323
```ts
24-
MY_GROUP.persist('storage-key-here');
24+
MY_GROUP.persist({key: 'storage-key-here'});
2525
```
2626

2727
Since many [Agile Sub Instance](../../../../main/Introduction.md#agile-sub-instance) can be persisted,
@@ -70,7 +70,7 @@ There are several ways to provide such required `storageKey` to the `persist()`
7070
```
7171
- **2.** Pass the `storageKey` directly into the `persist()` method.
7272
```ts {1}
73-
MY_INSTANCE.persist("myCoolPassedKey"); // Success (storageKey = 'myCoolPassedKey')
73+
MY_INSTANCE.persist({key: "myCoolPassedKey"}); // Success (storageKey = 'myCoolPassedKey')
7474
```
7575

7676
If AgileTs couldn't find any fitting `storageKey`,
@@ -103,3 +103,31 @@ By default, the AgilePersistInstance will be stored in the [default Storage](#-d
103103
```ts
104104
storageManager.config.defaultStorageKey; // Returns key of current default Storage
105105
```
106+
107+
## 🌈 Migration
108+
109+
In rare cases it is necessary to format the State value
110+
before it is persisted in an external Storage and migrated back later.
111+
When working with the `Date` class such formatting is required,
112+
since a javascript class can't be persisted.
113+
```ts
114+
const MY_STATE = createState(
115+
{
116+
// ..
117+
birthday: new Date('08.10.202')
118+
}
119+
).persist(
120+
{
121+
key: 'jeff',
122+
onSave: (value) => {
123+
value.date = value.date.getTime()
124+
return value;
125+
},
126+
onMigrate: (value) => {
127+
value.date = new Date(value.date);
128+
return value
129+
}
130+
}
131+
);
132+
```
133+

‎docs/packages/event/Introduction.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ slug: /event
1010
<a href="https://npm.im/@agile-ts/event">
1111
<img src="https://img.shields.io/npm/v/@agile-ts/event.svg?label=npm&style=flat&colorA=293140&colorB=4a4872" alt="npm version"/></a>
1212
<a href="https://npm.im/@agile-ts/event">
13-
<img src="https://img.shields.io/bundlephobia/min/@agile-ts/event.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
13+
<img src="https://img.shields.io/bundlephobia/minzip/@agile-ts/event.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
1414
<a href="https://npm.im/@agile-ts/event">
1515
<img src="https://img.shields.io/npm/dt/@agile-ts/event.svg?label=downloads&style=flat&colorA=293140&colorB=4a4872" alt="npm total downloads"/></a>
1616

‎docs/packages/logger/Introduction.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ slug: /logger
1010
<a href="https://npm.im/@agile-ts/logger">
1111
<img src="https://img.shields.io/npm/v/@agile-ts/logger.svg?label=npm&style=flat&colorA=293140&colorB=4a4872" alt="npm version"/></a>
1212
<a href="https://npm.im/@agile-ts/logger">
13-
<img src="https://img.shields.io/bundlephobia/min/@agile-ts/logger.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
13+
<img src="https://img.shields.io/bundlephobia/minzip/@agile-ts/logger.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
1414
<a href="https://npm.im/@agile-ts/logger">
1515
<img src="https://img.shields.io/npm/dt/@agile-ts/logger.svg?label=downloads&style=flat&colorA=293140&colorB=4a4872" alt="npm total downloads"/></a>
1616

‎docs/packages/multieditor/Introduction.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ slug: /multieditor
1010
<a href="https://npm.im/@agile-ts/multieditor">
1111
<img src="https://img.shields.io/npm/v/@agile-ts/multieditor.svg?label=npm&style=flat&colorA=293140&colorB=4a4872" alt="npm version"/></a>
1212
<a href="https://npm.im/@agile-ts/multieditor">
13-
<img src="https://img.shields.io/bundlephobia/min/@agile-ts/multieditor.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
13+
<img src="https://img.shields.io/bundlephobia/minzip/@agile-ts/multieditor.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
1414
<a href="https://npm.im/@agile-ts/multieditor">
1515
<img src="https://img.shields.io/npm/dt/@agile-ts/multieditor.svg?label=downloads&style=flat&colorA=293140&colorB=4a4872" alt="npm total downloads"/></a>
1616

‎docs/packages/react/Introduction.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ slug: /react
1010
<a href="https://npm.im/@agile-ts/react">
1111
<img src="https://img.shields.io/npm/v/@agile-ts/react.svg?label=npm&style=flat&colorA=293140&colorB=4a4872" alt="npm version"/></a>
1212
<a href="https://npm.im/@agile-ts/react">
13-
<img src="https://img.shields.io/bundlephobia/min/@agile-ts/react.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
13+
<img src="https://img.shields.io/bundlephobia/minzip/@agile-ts/react.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
1414
<a href="https://npm.im/@agile-ts/react">
1515
<img src="https://img.shields.io/npm/dt/@agile-ts/react.svg?label=downloads&style=flat&colorA=293140&colorB=4a4872" alt="npm total downloads"/></a>
1616

‎docs/packages/vue/Introduction.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ slug: /vue
1010
<a href="https://npm.im/@agile-ts/vue">
1111
<img src="https://img.shields.io/npm/v/@agile-ts/vue.svg?label=npm&style=flat&colorA=293140&colorB=4a4872" alt="npm version"/></a>
1212
<a href="https://npm.im/@agile-ts/vue">
13-
<img src="https://img.shields.io/bundlephobia/min/@agile-ts/vue.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
13+
<img src="https://img.shields.io/bundlephobia/minzip/@agile-ts/vue.svg?label=minified%20size&style=flat&colorA=293140&colorB=4a4872" alt="npm minified size"/></a>
1414
<a href="https://npm.im/@agile-ts/vue">
1515
<img src="https://img.shields.io/npm/dt/@agile-ts/vue.svg?label=downloads&style=flat&colorA=293140&colorB=4a4872" alt="npm total downloads"/></a>
1616

‎docusaurus.config.js

+6-4
Original file line numberDiff line numberDiff line change
@@ -21,12 +21,12 @@ const domain = 'https://agile-ts.org';
2121
const npmOrgUrl = 'https://www.npmjs.com/package/@agile-ts';
2222

2323
const customFields = {
24-
copyright: `Made with 💜 in Germany | Copyright © 2020-${new Date().getFullYear()} <a target="_blank" rel="noopener noreferrer" href="https://twitter.com/DevBenno">BennoDev</a>`,
24+
copyright: `Made with 💜 by <a target="_blank" rel="noopener noreferrer" href="https://twitter.com/DevBenno">BennoDev</a> and <a target="_blank" rel="noopener noreferrer" href="https://github.com/agile-ts/agile/graphs/contributors">these awesome people</a>`,
2525
meta: {
2626
title: 'An atom based state manager for JavaScript apps.',
2727
image: '/img/meta.png',
2828
description:
29-
'A global State and Logic Library implemented in Typescript, ' +
29+
'An atom based global State and Logic Library implemented in Typescript, ' +
3030
'offering a reimagined API that focuses on developer experience. ' +
3131
'AgileTs is a more straightforward alternative to Redux ' +
3232
'and allows you to easily manage your application States in React, Vue and plain Javascript.',
@@ -109,8 +109,10 @@ const config = {
109109
customFields: { ...customFields },
110110
themeConfig: {
111111
hideableSidebar: false,
112+
// https://docusaurus.io/docs/search#using-algolia-docsearch
112113
algolia: {
113-
apiKey: '6b7b98565bb82e16996fd185f378d618',
114+
appId: '64P3EOD5L9',
115+
apiKey: '461e97fe74b935316bf63af4a6a93345',
114116
indexName: 'agile-ts',
115117
},
116118
colorMode: {
@@ -183,7 +185,7 @@ const config = {
183185
{
184186
label: 'Documentation',
185187
position: 'left',
186-
to: 'docs/introduction/',
188+
to: 'docs/introduction',
187189
},
188190
],
189191
},

‎package.json

+15-15
Original file line numberDiff line numberDiff line change
@@ -19,18 +19,18 @@
1919
"install:prod:agile": "yarn add @agile-ts/core @agile-ts/react @agile-ts/api @agile-ts/event @agile-ts/proxytree @agile-ts/logger @agile-ts/utils & yarn install"
2020
},
2121
"dependencies": {
22-
"@agile-ts/api": "^0.0.24",
23-
"@agile-ts/core": "^0.2.6",
24-
"@agile-ts/event": "^0.0.13",
25-
"@agile-ts/logger": "^0.0.10",
26-
"@agile-ts/proxytree": "^0.0.8",
27-
"@agile-ts/react": "^0.2.2",
28-
"@agile-ts/utils": "^0.0.10",
29-
"@docusaurus/core": "2.0.0-beta.6",
30-
"@docusaurus/module-type-aliases": "2.0.0-beta.6",
31-
"@docusaurus/preset-classic": "2.0.0-beta.6",
32-
"@docusaurus/remark-plugin-npm2yarn": "2.0.0-beta.6",
33-
"@docusaurus/theme-live-codeblock": "2.0.0-beta.6",
22+
"@agile-ts/api": "^0.0.25",
23+
"@agile-ts/core": "^0.2.7",
24+
"@agile-ts/event": "^0.0.14",
25+
"@agile-ts/logger": "^0.0.11",
26+
"@agile-ts/proxytree": "^0.0.9",
27+
"@agile-ts/react": "^0.2.3",
28+
"@agile-ts/utils": "^0.0.11",
29+
"@docusaurus/core": "^2.0.0-beta.14",
30+
"@docusaurus/module-type-aliases": "^2.0.0-beta.14",
31+
"@docusaurus/preset-classic": "^2.0.0-beta.14",
32+
"@docusaurus/remark-plugin-npm2yarn": "^2.0.0-beta.14",
33+
"@docusaurus/theme-live-codeblock": "^2.0.0-beta.14",
3434
"@mdx-js/react": "^1.6.22",
3535
"@tsconfig/docusaurus": "^1.0.4",
3636
"clsx": "^1.1.1",
@@ -39,10 +39,10 @@
3939
"react-dom": "^17.0.2",
4040
"react-icons": "^4.2.0",
4141
"react-live": "^2.3.0",
42-
"react-spring": "^8.0.27",
42+
"react-spring": "^9.3.2",
4343
"react-swipeable": "^6.2.0",
44-
"react-toastify": "^6.2.0",
45-
"sass": "^1.39.2",
44+
"react-toastify": "^8.1.0",
45+
"sass": "^1.43.5",
4646
"webpack-bundle-analyzer": "^4.4.2"
4747
},
4848
"devDependencies": {

‎src/_pages/LandingPage/components/HeaderView/components/Astronaut/index.tsx

+5-3
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,8 @@ const Astronaut: React.FC<Props> = (props) => {
1515
const [inAnimation, setInAnimation] = useState(false);
1616
const [triggeredAnimationColor, setTriggeredAnimationColor] = useState(false);
1717
const dark = useAgile(core.ui.ASTRONAUT_DARK);
18+
19+
// Animation
1820
const animatedAstronautProps = useSpring({
1921
to: { x: isRaised ? 0 : 1 },
2022
config: {
@@ -29,8 +31,8 @@ const Astronaut: React.FC<Props> = (props) => {
2931
setTriggeredAnimationColor(false);
3032
}
3133
},
32-
onFrame: (frame) => {
33-
if (frame.x >= 0.45 && frame.x <= 0.5 && !triggeredAnimationColor) {
34+
onChange: ({ value }) => {
35+
if (value.x >= 0.45 && value.x <= 0.5 && !triggeredAnimationColor) {
3436
core.ui.toggleAstronautColor(!dark);
3537
setTriggeredAnimationColor(true);
3638
}
@@ -48,7 +50,7 @@ const Astronaut: React.FC<Props> = (props) => {
4850
<div className={clsx(styles.Container, className)}>
4951
<animated.div
5052
style={{
51-
transform: (animatedAstronautProps as any).x.interpolate({
53+
transform: (animatedAstronautProps as any).x.to({
5254
range: [0, 0.5, 1],
5355
output: [
5456
`translateY(${0}px)`,

‎src/_pages/LandingPage/components/StraightforwardView/components/SectionScroller/components/SectionLeftItem/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const SectionLeftItem: React.FC<Props> = (props) => {
2020
className={clsx(styles.Container, {
2121
[styles.Container_Active]: active,
2222
})}>
23-
<CodeBlock className={'javascript'}>{code}</CodeBlock>
23+
<CodeBlock className="jsx">{code}</CodeBlock>
2424
</div>
2525
);
2626
};

‎src/core/app.ts

-9
This file was deleted.

‎src/core/entities/stats/stats.controller.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { createState } from '@agile-ts/core';
22

3-
export const NPM_DOWNLOADS = createState(0).persist('npm-downloads');
4-
export const GITHUB_STARS = createState(0).persist('github-stars');
5-
export const GITHUB_FORKS = createState(0).persist('github-forks');
3+
export const NPM_DOWNLOADS = createState(0).persist({ key: 'npm-downloads' });
4+
export const GITHUB_STARS = createState(0).persist({ key: 'github-stars' });
5+
export const GITHUB_FORKS = createState(0).persist({ key: 'github-forks' });

‎src/core/entities/ui/ui.controller.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
import { createState } from '@agile-ts/core';
22

3-
export const ASTRONAUT_DARK = createState<boolean>(false);
3+
export const ASTRONAUT_DARK = createState(false);

0 commit comments

Comments
 (0)