{"id":13496425,"url":"https://github.com/devexperts/remote-data-ts","last_synced_at":"2026-03-03T08:50:18.033Z","repository":{"id":30472632,"uuid":"125033418","full_name":"devexperts/remote-data-ts","owner":"devexperts","description":"RemoteData type","archived":false,"fork":false,"pushed_at":"2023-10-16T18:51:03.000Z","size":1515,"stargazers_count":289,"open_issues_count":10,"forks_count":29,"subscribers_count":32,"default_branch":"master","last_synced_at":"2024-04-14T11:00:57.271Z","etag":null,"topics":["algebraic-data-types","fp-ts","functional-programming","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mpl-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/devexperts.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}},"created_at":"2018-03-13T10:24:48.000Z","updated_at":"2024-04-02T21:19:19.000Z","dependencies_parsed_at":"2023-01-14T17:01:36.837Z","dependency_job_id":"5e1b535e-86b3-45b8-af2e-bab63555c719","html_url":"https://github.com/devexperts/remote-data-ts","commit_stats":{"total_commits":148,"total_committers":21,"mean_commits":"7.0476190476190474","dds":"0.41891891891891897","last_synced_commit":"13c70218bf18aca7afe7ec641be1d92ce6b2e902"},"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devexperts%2Fremote-data-ts","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devexperts%2Fremote-data-ts/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devexperts%2Fremote-data-ts/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devexperts%2Fremote-data-ts/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/devexperts","download_url":"https://codeload.github.com/devexperts/remote-data-ts/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246080746,"owners_count":20720582,"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":["algebraic-data-types","fp-ts","functional-programming","typescript"],"created_at":"2024-07-31T19:01:47.690Z","updated_at":"2026-03-03T08:50:12.983Z","avatar_url":"https://github.com/devexperts.png","language":"TypeScript","funding_links":[],"categories":["TypeScript","Domain modeling in TypeScript by Benoit Ruiz"],"sub_categories":[],"readme":"# RemoteData type [![Build Status](https://travis-ci.org/devexperts/remote-data-ts.svg?branch=master)](https://travis-ci.org/devexperts/remote-data-ts)\n### Description\nRemoteData is an ADT (algebraic data type) described in [this article](https://medium.com/@gcanti/slaying-a-ui-antipattern-with-flow-5eed0cfb627b). Heavily based on [fp-ts](https://github.com/gcanti/fp-ts) lib.\n\n### Installation\n`npm i --save @devexperts/remote-data-ts`\n\n### How to lift (wrap) your data in RemoteData:\nAs you remember RemoteData is an union of few types: `RemoteInitial`, `RemotePending`, `RemoteFailure` and `RemoteSuccess`.\n\nWhile your data in **initial** or **pending** state just use `initial` or `pending` constant, because you don't have any **real** values in this case.\n\n```ts\nimport { initial, pending } from '@devexperts/remote-data-ts';\n\nconst customers = initial;\n// or\nconst customers = pending;\n```\n\nWhen you receive data from server, use `failure` or `success` function, it depends on what you received:\n\n```ts\nimport { failure, success } from '@devexperts/remote-data-ts';\nimport { apiClient } from 'apiClient';\nimport { TCustomer } from './MyModel';\n\nconst getCustomers = (): RemoteData\u003cTCustomer[]\u003e =\u003e {\n   const rawData: TCustomer[] = apiClient.get('/customers');\n\n   try {\n        const length = rawData.length;\n\n        return success(rawData);\n   }\n   catch(err) {\n        return failure(new Error('parse error'));\n   }\n}\n```\n\n### How to fold (unwrap) your data from RemoteData:\nFinally you pass data to the component and want to render values, so now it's time to get our values back from RemoteData wrapper:\n\n```ts\nimport { NoData, Pending, Failure } from './MyPlaceholders';\nimport { TCustomer } from './MyModel';\n\ntype TCustomersList = {\n    entities: RemoteData\u003cTCustomer[]\u003e;\n};\n\nconst CustomersList: SFC\u003cTCustomersList\u003e = ({ entities }) =\u003e entities.foldL(\n    () =\u003e \u003cNoData /\u003e,\n    () =\u003e \u003cPending /\u003e,\n    err =\u003e \u003cFailure error={err} /\u003e,\n    data =\u003e \u003cul\u003e{data.map(item =\u003e \u003cli\u003e{item.name}\u003c/li\u003e)}\u003c/ul\u003e\n);\n```\n\n### Docs \u0026 Examples\nComing soon (check the [source](src/remote-data.ts))\n\n\n### Contributions\n- use https://www.conventionalcommits.org/en/v1.0.0-beta.2/\n\n### Publish\nDon't forget to run `npm run changelog` and to commit the changes\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevexperts%2Fremote-data-ts","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdevexperts%2Fremote-data-ts","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevexperts%2Fremote-data-ts/lists"}