Skip to content

Commit e5e53b3

Browse files
rainerhahnekamprainerhahnekamp
committed
ci: fix docs build
Update deploy-docs.yml
1 parent 76665f3 commit e5e53b3

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+19377
-20
lines changed

‎.github/workflows/deploy-docs.yml

+61
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
name: Deploy to GitHub Pages
2+
3+
defaults:
4+
run:
5+
working-directory: ./docs
6+
7+
on:
8+
push:
9+
branches:
10+
- main
11+
# Review gh actions docs if you want to further define triggers, paths, etc
12+
# https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#on
13+
14+
jobs:
15+
build:
16+
name: Build Docusaurus
17+
runs-on: ubuntu-latest
18+
steps:
19+
- uses: actions/checkout@v4
20+
with:
21+
fetch-depth: 0
22+
- uses: pnpm/action-setup@v4
23+
with:
24+
version: 9
25+
- uses: actions/setup-node@v4
26+
with:
27+
node-version: 18
28+
cache: pnpm
29+
30+
- name: Install dependencies for toolkit
31+
run: cd .. && pnpm install --frozen-lockfile
32+
33+
- name: Install dependencies
34+
run: pnpm install --frozen-lockfile
35+
- name: Build website
36+
run: pnpm build
37+
38+
- name: Upload Build Artifact
39+
uses: actions/upload-pages-artifact@v3
40+
with:
41+
path: docs/build
42+
43+
deploy:
44+
name: Deploy to GitHub Pages
45+
needs: build
46+
47+
# Grant GITHUB_TOKEN the permissions required to make a Pages deployment
48+
permissions:
49+
pages: write # to deploy to Pages
50+
id-token: write # to verify the deployment originates from an appropriate source
51+
52+
# Deploy to the github-pages environment
53+
environment:
54+
name: github-pages
55+
url: ${{ steps.deployment.outputs.page_url }}
56+
57+
runs-on: ubuntu-latest
58+
steps:
59+
- name: Deploy to GitHub Pages
60+
id: deployment
61+
uses: actions/deploy-pages@v4

‎.husky/commit-msg

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,2 @@
1-
#!/usr/bin/env sh
2-
. "$(dirname -- "$0")/_/husky.sh"
31

4-
npx --no -- commitlint --edit ${1}
2+
pnpm --no -- commitlint --edit ${1}

‎.lintstagedrc

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
{
2-
"*.{js,ts,json,html,scss}": ["prettier --write"]
2+
"*.{js,ts,json,html,scss,md}": ["prettier --write"]
33
}

‎README.md

+1-3
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,7 @@
22

33
[![npm](https://img.shields.io/npm/v/%40angular-architects%2Fngrx-toolkit.svg)](https://www.npmjs.com/package/%40angular-architects%2Fngrx-toolkit)
44

5-
<p align="center">
6-
<img src="https://raw.githubusercontent.com/angular-architects/ngrx-toolkit/main/logo.png" width="320" style="text-align: center">
7-
</p>
5+
<img src="https://raw.githubusercontent.com/angular-architects/ngrx-toolkit/main/logo.png" width="320" style="text-align: center" />
86

97
NgRx Toolkit is an extension to the NgRx Signals Store. **It is still in beta** but already offers features, like:
108

‎docs/.gitignore

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
# Dependencies
2+
/node_modules
3+
4+
# Production
5+
/build
6+
7+
# Generated files
8+
.docusaurus
9+
.cache-loader
10+
11+
# Misc
12+
.DS_Store
13+
.env.local
14+
.env.development.local
15+
.env.test.local
16+
.env.production.local
17+
18+
npm-debug.log*
19+
yarn-debug.log*
20+
yarn-error.log*
21+
/docs/api/

‎docs/README.md

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
# Website
2+
3+
This website is built using [Docusaurus](https://docusaurus.io/), a modern static website generator.
4+
5+
### Installation
6+
7+
```
8+
$ yarn
9+
```
10+
11+
### Local Development
12+
13+
```
14+
$ yarn start
15+
```
16+
17+
This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
18+
19+
### Build
20+
21+
```
22+
$ yarn build
23+
```
24+
25+
This command generates static content into the `build` directory and can be served using any static contents hosting service.
26+
27+
### Deployment
28+
29+
Using SSH:
30+
31+
```
32+
$ USE_SSH=true yarn deploy
33+
```
34+
35+
Not using SSH:
36+
37+
```
38+
$ GIT_USER=<Your GitHub username> yarn deploy
39+
```
40+
41+
If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.

‎docs/docs/create-redux-state.md

+133
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
2+
The Redux Connector it is not an extension but turns any `signalStore()` into a Global State Management Slice following the Redux pattern.
3+
4+
It is available as secondary entry point, i.e. `import { createReduxState } from '@angular-architects/ngrx-toolkit/redux-connector'` and has a dependency to `@ngrx/store`.
5+
6+
An extension without dependency to `@ngrx/store` is available with [`withRedux()`](./with-redux).
7+
8+
It supports:
9+
10+
✅ Well-known NgRx Store Actions
11+
✅ Global Action `dispatch()`
12+
✅ Angular Lazy Loading
13+
✅ Auto-generated `provideNamedStore()` & `injectNamedStore()` Functions
14+
✅ Global Action to Store Method Mappers
15+
16+
### Use a present Signal Store
17+
18+
```typescript
19+
export const FlightStore = signalStore(
20+
// State
21+
withEntities({ entity: type<Flight>(), collection: 'flight' }),
22+
withEntities({ entity: type<number>(), collection: 'hide' }),
23+
// Selectors
24+
withComputed(({ flightEntities, hideEntities }) => ({
25+
filteredFlights: computed(() => flightEntities()
26+
.filter(flight => !hideEntities().includes(flight.id))),
27+
flightCount: computed(() => flightEntities().length),
28+
})),
29+
// Updater
30+
withMethods(store => ({
31+
setFlights: (state: { flights: Flight[] }) => patchState(store,
32+
setAllEntities(state.flights, { collection: 'flight' })),
33+
updateFlight: (state: { flight: Flight }) => patchState(store,
34+
updateEntity({ id: state.flight.id, changes: state.flight }, { collection: 'flight' })),
35+
clearFlights: () => patchState(store,
36+
removeAllEntities({ collection: 'flight' })),
37+
})),
38+
// Effects
39+
withMethods((store, flightService = inject(FlightService)) => ({
40+
loadFlights: reduxMethod<FlightFilter, { flights: Flight[] }>(pipe(
41+
switchMap(filter => from(
42+
flightService.load({ from: filter.from, to: filter.to })
43+
)),
44+
map(flights => ({ flights })),
45+
), store.setFlights),
46+
})),
47+
);
48+
```
49+
50+
### Use well-known NgRx Store Actions
51+
52+
```typescript
53+
export const ticketActions = createActionGroup({
54+
source: 'tickets',
55+
events: {
56+
'flights load': props<FlightFilter>(),
57+
'flights loaded': props<{ flights: Flight[] }>(),
58+
'flights loaded by passenger': props<{ flights: Flight[] }>(),
59+
'flight update': props<{ flight: Flight }>(),
60+
'flights clear': emptyProps()
61+
}
62+
});
63+
```
64+
65+
### Map Actions to Methods
66+
67+
```typescript
68+
export const { provideFlightStore, injectFlightStore } =
69+
createReduxState('flight', FlightStore, store => withActionMappers(
70+
mapAction(
71+
// Filtered Action
72+
ticketActions.flightsLoad,
73+
// Side-Effect
74+
store.loadFlights,
75+
// Result Action
76+
ticketActions.flightsLoaded),
77+
mapAction(
78+
// Filtered Actions
79+
ticketActions.flightsLoaded, ticketActions.flightsLoadedByPassenger,
80+
// State Updater Method (like Reducers)
81+
store.setFlights
82+
),
83+
mapAction(ticketActions.flightUpdate, store.updateFlight),
84+
mapAction(ticketActions.flightsClear, store.clearFlights),
85+
)
86+
);
87+
```
88+
89+
### Register an Angular Dependency Injection Provider
90+
91+
```typescript
92+
export const appRoutes: Route[] = [
93+
{
94+
path: 'flight-search-redux-connector',
95+
providers: [provideFlightStore()],
96+
component: FlightSearchReducConnectorComponent
97+
},
98+
];
99+
```
100+
101+
### Use the Store in your Component
102+
103+
```typescript
104+
@Component({
105+
standalone: true,
106+
imports: [
107+
JsonPipe,
108+
RouterLink,
109+
FormsModule,
110+
FlightCardComponent
111+
],
112+
selector: 'demo-flight-search-redux-connector',
113+
templateUrl: './flight-search.component.html',
114+
})
115+
export class FlightSearchReducConnectorComponent {
116+
private store = injectFlightStore();
117+
118+
protected flights = this.store.flightEntities;
119+
120+
protected search() {
121+
this.store.dispatch(
122+
ticketActions.flightsLoad({
123+
from: this.localState.filter.from(),
124+
to: this.localState.filter.to()
125+
})
126+
);
127+
}
128+
129+
protected reset(): void {
130+
this.store.dispatch(ticketActions.flightsClear());
131+
}
132+
}
133+
```

‎docs/docs/extensions.md

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
---
2+
title: Extensions
3+
---
4+
5+
The NgRx Toolkit is a set of extensions to the NgRx SignalsStore.
6+
7+
It offers extensions like:
8+
9+
- [⭐️ Devtools](./with-devtools): Integration into Redux Devtools
10+
- [Redux](./with-redux): Possibility to use the Redux Pattern (Reducer, Actions, Effects)
11+
- [Storage Sync](./with-storage-sync): Synchronize the Store with Web Storage
12+
13+
To install it, run
14+
15+
```shell
16+
npm i @angular-architects/ngrx-toolkit
17+
```

0 commit comments

Comments
 (0)