Skip to content

Instantly share code, notes, and snippets.

View daveharmswebdev's full-sized avatar

Dave daveharmswebdev

View GitHub Profile
@daveharmswebdev
daveharmswebdev / todo.component.ts
Last active February 10, 2019 18:32
Todo Component
toggleComplete(todo: ITodo) {
const todoUpdate: Update<ITodo> = {
id: todo.id,
changes: { complete: !todo.complete }
};
this.store.dispatch(new ToggleComplete(todoUpdate));
}
edit(todo: ITodo) {
this.dialogService.openEditDialog(todo).subscribe(
@daveharmswebdev
daveharmswebdev / todo.reducer.ts
Last active February 10, 2019 19:00
Todo Reducer with todo interface
export function todoReducer(
state: ITodoState = initialTodoState,
action: TodoActions
): ITodoState {
switch (action.type) {
case TodoActionTypes.AddTodo: {
const todo = {
...action.payload.todo,
id: uuid()
};
@daveharmswebdev
daveharmswebdev / todo.actions.ts
Last active February 10, 2019 18:36
Todo Ngrx Actions
export class UpdateDescription implements Action {
readonly type = TodoActionTypes.UpdateDescription;
constructor(public payload: Update<ITodo>) {}
}
export class ToggleComplete implements Action {
readonly type = TodoActionTypes.ToggleComplete;
constructor(public payload: Update<ITodo>) {}
}
@daveharmswebdev
daveharmswebdev / todos.reducer.ts
Created November 14, 2017 13:25
todolist ngrx refactor todos reducer.
import { ITodo } from '../models';
import * as ListActions from '../actions/todo-list.actions';
export type Action = ListActions.All;
export function todosReducer(state: ITodo[], action: Action) {
switch (action.type) {
case ListActions.FETCH_TODOS_SUCCESS:
return action.payload;
default:
@daveharmswebdev
daveharmswebdev / todo-list.actions.ts
Created November 14, 2017 13:15
todo-list.actions.ts
import { Action } from '@ngrx/store';
import { ITodoList, ITodo } from '../models';
export const FETCH_LISTS = 'FETCH_LISTS';
export const FETCH_LISTS_SUCCESS = 'FETCH_LISTS_SUCCESS';
export const SELECT_LIST = 'SELECT_LIST';
export const FETCH_TODOS = 'FETCH_TODO';
export const FETCH_TODOS_SUCCESS = 'FETCH_TODO_SUCCESS';
@daveharmswebdev
daveharmswebdev / app.component.ts
Last active November 14, 2017 13:01
Injectecting appstate into app.component
import { Observable } from 'rxjs/Rx';
import { Component, OnInit } from '@angular/core';
import { ITodoList } from './models/todoList';
import { ITodo } from './models/todo';
// ngrx
import { Store } from '@ngrx/store';
import { IAppState } from './models/appState';
import * as ListActions from './actions/list.actions';
@daveharmswebdev
daveharmswebdev / appState.ts
Created November 14, 2017 12:51
todolist ngrx refactor models
import { ITodoList } from './todoList';
import { ITodo } from './todo';
export interface IAppState {
todoLists: ITodoList[];
currentTodoList: number;
todos: ITodo[];
}
export const INITIAL_STATE: IAppState = {
@daveharmswebdev
daveharmswebdev / app.module.ts
Created November 14, 2017 12:40
Initial import of StoreModule & Devtools
import { FormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { TodoService } from './todo.service';
// ngrx
import { StoreModule } from '@ngrx/store';