perjo927

import { html } from "lit-html";

const Todo = ({ onToggleClick, onDeleteClick, text, done }) => {
  const toggleClass = "todo toggle";
  const deleteClass = "todo delete";
  const textClass = `todo text ${done ? " done" : ""}`;
  const checkMark = done ? "✔" : "";

  return html`
    <li>

perjo927

import { createStore } from "./redux/store/index";
import { actions } from "./redux/actions/index";
import { rootReducer } from "./redux/reducers/index";

const store = createStore(rootReducer, {});

store.subscribe(() => console.log(store.getState()));
const { id } = store.dispatch(actions.addTodo({id: 1, done: false, text: "My first todo"}));
store.dispatch(actions.toggleTodo(id));
store.dispatch(actions.undo());

perjo927

import { visibilityReducer } from "./visibility";
import { todoReducer, areTodosEqual } from "./todos";
import { getUndoableReducer } from "./undoable";
import { combineReducers } from "./combineReducers";

export const undoableTodoReducer = getUndoableReducer(
  todoReducer,
  areTodosEqual
);

perjo927

/*
  Read more at:
  https://redux.js.org/api/combinereducers
*/
export const combineReducers = (reducers) => (
  state = {},
  action = { value: null, type: null }
) =>
  Object.keys(reducers).reduce((nextState, key) => {
    // Call every reducer with the part of the state it manages

perjo927

import { CONSTS } from "../actions/index.js";

const {
  actions: { UNDO, REDO },
} = CONSTS;

/*
    Read more at:
    https://redux.js.org/recipes/implementing-undo-history

perjo927

import { CONSTS } from "../actions/index.js";

const {
  actions: { ADD, DELETE, TOGGLE },
} = CONSTS;

export const addTodo = (state, newTodo) => [...state, newTodo];

export const deleteTodo = (state, id) => state.filter((todo) => todo.id !== id);

perjo927

import { CONSTS } from "../actions";

const {
  actions: { SET_VISIBILITY },
  visibilityFilters: { ALL },
} = CONSTS;

export const setVisibility = (state, filter) => filter;

export const visibilityReducer = (state = ALL, action) =>

perjo927

export const CONSTS = {
  actions: {
    ADD: "ADD",
    DELETE: "DELETE",
    UNDO: "UNDO",
    REDO: "REDO",
    TOGGLE: "TOGGLE",
    SET_VISIBILITY: "SET_VISIBILITY",
  },
  visibilityFilters: {

perjo927

import {
  createTodoBase,
  createTodoItem,
  getTodoItem,
} from "../src/factories/todo/index.js";

import assert from "assert";

describe("factories", () => {
  describe("todo", () => {

perjo927

import { generateId } from "../id/index.js";

export const createTodoBase = (text) => ({ text, done: false });

export const createTodoItem = (todoObj, idObj) => ({
  ...todoObj,
  ...idObj,
});

export const getTodoItem = (text) => {