{"id":20208835,"url":"https://github.com/palantir/redoodle","last_synced_at":"2025-04-12T13:34:01.041Z","repository":{"id":24049320,"uuid":"95799813","full_name":"palantir/redoodle","owner":"palantir","description":"An addon library for Redux that enhances its integration with TypeScript.","archived":false,"fork":false,"pushed_at":"2024-12-14T11:39:25.000Z","size":1038,"stargazers_count":100,"open_issues_count":6,"forks_count":19,"subscribers_count":215,"default_branch":"master","last_synced_at":"2025-04-06T05:39:29.992Z","etag":null,"topics":["octo-correct-managed","redux","typescript"],"latest_commit_sha":null,"homepage":"https://palantir.github.io/redoodle/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/palantir.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-06-29T16:58:12.000Z","updated_at":"2025-03-23T23:41:40.000Z","dependencies_parsed_at":"2024-10-08T08:13:20.913Z","dependency_job_id":"922b5ebc-2bf6-457f-a72d-b4532555ecf7","html_url":"https://github.com/palantir/redoodle","commit_stats":{"total_commits":109,"total_committers":15,"mean_commits":7.266666666666667,"dds":0.5321100917431192,"last_synced_commit":"e262a9ec4aa38ab51404aadcad0128f608d8e0e3"},"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/palantir%2Fredoodle","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/palantir%2Fredoodle/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/palantir%2Fredoodle/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/palantir%2Fredoodle/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/palantir","download_url":"https://codeload.github.com/palantir/redoodle/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248573410,"owners_count":21126824,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["octo-correct-managed","redux","typescript"],"created_at":"2024-11-14T05:37:23.158Z","updated_at":"2025-04-12T13:34:01.012Z","avatar_url":"https://github.com/palantir.png","language":"TypeScript","funding_links":[],"categories":["Marks"],"sub_categories":["[React - A JavaScript library for building user interfaces](http://facebook.github.io/react)"],"readme":"\u003cp align=\"right\"\u003e\n\u003ca href=\"https://autorelease.general.dmz.palantir.tech/palantir/redoodle\"\u003e\u003cimg src=\"https://img.shields.io/badge/Perform%20an-Autorelease-success.svg\" alt=\"Autorelease\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n# Redoodle\n\nRedoodle is an addon library for Redux that enhances its integration with TypeScript.\n\nRedoodle includes a few major categories of addons that can be used individually\nand play well with each other:\n\n- [Typed Actions](#typed-actions), or \"finally my reducers will stop breaking when I refactor\"\n- [Compound Actions](#compound-actions), or \"my action creators are finally sane\"\n- Immutable typesafe state manipulation [functions](#utilities)\n- Some [opinions on state management](#on-initial-state-management)\n\n[![Circle CI](https://img.shields.io/circleci/project/github/palantir/redoodle/master.svg?style=flat-square)](https://circleci.com/gh/palantir/redoodle)\n[![npm](https://img.shields.io/npm/v/redoodle.svg?style=flat-square)](https://www.npmjs.com/package/redoodle)\n\n\n## Motivation\n\nRedux brought sanity to state management,\nand has found itself a seat in many a React application's architecture.\nTypeScript is also gaining a large amount of traction,\nand has impressed the community with its month-over-month high quality releases.\nUnfortunately, there were a few places where default Redux and TypeScript\nfailed to play well with each other:\n\n1. Redux Actions have magic string types and opaque payloads,\n   with no obvious mechanism to track the correlation between the two.\n2. Redux Reducers have no easy way to infer correct typings for different Action branches.\n3. The TypeScript/JavaScript STL lacks good immutable state update functions.\n   While this has gotten better with Object and Array spread and their reasonable typings,\n   there is still a dearth of exact behavior for certain common Redux update workflows.\n\nRedoodle attempts to solve these integration pains,\nand takes a stab at a few more common points of developer frustration when working\nwith Redux and Typescript.\n\n\n## Features\n\n\n### Typed Actions\n\nTyped Actions do the most legwork to bridge the Redux-TypeScript divide, by correlating\nAction magic type strings with Action magic payloads.\nWith Redoodle, you can create an Action Definition, and then use that Definition\nin all places you were previously guessing, casting, or crying.\n\n```ts\nimport { defineAction, TypedReducer, setWith } from \"redoodle\";\n\n// FlipTable is an action Definition for actions of type \"FlipTable\",\n// and associates the given payload type with the action.\nconst FlipTable = defineAction(\"FlipTable\")\u003c{\n  tableId: string;\n  face: \"happy\" | \"angry\";\n}\u003e();\n\n// We can use a Definition to create a matching Action. This is all type-safe.\n// At runtime, the `action` below has the value\n//\n//    {\n//      type: \"FlipTable\",\n//      payload: {\n//        tableId: \"2567f216-59b7-4bfe-b46f-909c6711fea4\",\n//        face: \"happy\"\n//      }\n//    }\n//\nconst action = FlipTable({\n  tableId: \"2567f216-59b7-4bfe-b46f-909c6711fea4\",\n  face: \"happy\"\n});\n\n// We can also use Definitions to create Reducers that offer slick type inferencing.\n// No more manual casts!\ninterface BanquetHall {\n  [tableId: string]: {\n    isFlipped: boolean;\n  }\n}\n\n// banquetHallReducer is a standard Redux Reducer\u003cBanquetHall\u003e. Nothing fancy.\nconst banquetHallReducer = TypedReducer.builder\u003cBanquetHall\u003e()\n  // FlipTable.TYPE is the plain string \"FlipTable\", but it's branded with\n  // rich compile-time information about its associated payload type `{tableId, face}`.\n  .withHandler(FlipTable.TYPE, (state, { tableId, face }) =\u003e {\n    // All of the operations here are 100% type-safe. If I misspelled `isFlipped` below\n    // in either place, or fail to copy the correct subset of state when applying my\n    // immutable copies, the compiler will save me!\n    return setWith(state, {\n      [tableId]: setWith(state[tableId], {\n        isFlipped: !state[tableId].isFlipped\n      })\n    });\n  })\n  .build();\n```\n\nFor more on Typed Actions, probably the most simple and significant utility\nRedoodle offers, check out the Redoodle\n[docs](https://palantir.github.io/redoodle/docs/actions/).\n\n\n### Compound Actions\n\nThe only builtin Action Definition that Redoodle ships with is the CompoundAction,\nwhich is a simple higher-level Action that wraps another set of Actions.\nIts alternatives in stock Redux is either to\n\n1. Create more complex DoFooAndBar actions, which have the drawback of making every Reducer that cares about\n   DoFoo _or_ DoBar also care about DoFooAndBar.\n1. Dispatch DoFoo and DoBar individually, which has the drawback of causing multiple Store subscription events,\n   which often results in e.g. multiple React renders. It also has the drawback of publishing a possibly inconsistent\n   intermediate state when DoFoo was applied but not DoBar.\n\n```ts\nimport { CompoundAction } from \"redoodle\";\n\nconst doFoo: Action = {...};\nconst doBar: Action = {...};\n\nstore.dispatch(CompoundAction([doFoo, doBar]));\n```\n\nTo use CompoundActions, your store must be configured to correctly unwrap and reduce them; thankfully Redoodle\ncomes with a `compoundActionsEnhancer()` (or the simpler `reduceCompoundActions` decorator) for exactly that.\n\nFor more on CompoundActions, check out the Redoodle\n[docs](https://palantir.github.io/redoodle/docs/compound/).\n\n\n### Utilities\n\nRedoodle packages a number of utility functions,\nsome explicitly for clean TypeScript immutable state manipulation,\nsome for completeness in developer experience.\n\n- [combineReducers(reducers)](https://palantir.github.io/redoodle/docs/utilities/combineReducers.html)\n- [composeReducers(...reducers)](https://palantir.github.io/redoodle/docs/utilities/composeReducers.html)\n- [compoundActionsEnhancer()](https://palantir.github.io/redoodle/docs/utilities/compoundActionsEnhancer.html)\n- [createStore()](https://palantir.github.io/redoodle/docs/utilities/createStore.html)\n- [loggingMiddleware([options])](https://palantir.github.io/redoodle/docs/utilities/loggingMiddleware.html)\n- [omit(state, keys)](https://palantir.github.io/redoodle/docs/utilities/omit.html)\n- [reduceCompoundActions(reducer)](https://palantir.github.io/redoodle/docs/utilities/reduceCompoundActions.html)\n- [setWith(state, ...overrides)](https://palantir.github.io/redoodle/docs/utilities/setWith.html)\n\n### On Initial State Management\n\nRedoodle firmly believes that specific benefits the TypeScript compiler provides\nshould change the way we think about Redux State initialization.\nThis shifts the behavior of some Redoodle utilities slightly to be more ergonomic for developers,\nand is discussed in greater detail [here](https://palantir.github.io/redoodle/docs/InitialState.html).\n\n## Documentation\n\n* [Introduction](https://palantir.github.io/redoodle/)\n* [defineAction](https://palantir.github.io/redoodle/docs/actions/)\n* [Compound Actions](https://palantir.github.io/redoodle/docs/compound/)\n* [Initial State Management](https://palantir.github.io/redoodle/docs/InitialState.html)\n* [Utilities](https://palantir.github.io/redoodle/docs/utilities/)\n* [FAQ](https://palantir.github.io/redoodle/docs/FAQ.html)\n\n## License\n\nApache 2.0\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpalantir%2Fredoodle","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpalantir%2Fredoodle","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpalantir%2Fredoodle/lists"}