Skills fp-ts-react
๐Ÿ“ฆ

fp-ts-react

Content revision r2 Safe โš™๏ธ External commands๐ŸŒ Network access

Build Type-Safe React Apps with fp-ts

React async state and validation often become inconsistent. This skill provides fp-ts patterns for predictable hooks, forms, data fetching, and dependency injection.

Supports: Claude Codex Code(CC)
๐Ÿ“Š 76 Adequate

Install with my Agent

Copy this request to your Agent. It includes the canonical Skill page and manifest.

Agent request
Review the Skillstore skill "fp-ts-react" from https://skillstore.io/skills/sickn33-fp-ts-react.md and its manifest at https://skillstore.io/api/skills/sickn33-fp-ts-react/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Your Agent should still show its plan and request any confirmation required by the security policy.

Agent-readable resources

Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.

Test it

Using "fp-ts-react". Model a profile that may be absent and render a login fallback.

Expected outcome:

An Option-based state design with explicit absent and present render paths, plus a short explanation of the transitions.

Using "fp-ts-react". Validate signup fields and show all problems together.

Expected outcome:

  • Typed validators for name, email, and password.
  • An accumulated error model for simultaneous feedback.
  • A React submission flow that handles failure and success.

Using "fp-ts-react". Load dashboard resources concurrently with typed failures.

Expected outcome:

A TaskEither composition plan covering parallel requests, combined success data, failure mapping, and RemoteData rendering.

Security Audit

Safe
v5 โ€ข 7/23/2026 Open versioned report

All 85 static findings are false positives in Markdown documentation and TypeScript examples. Backticks format code or form template literals, while fetch calls use illustrative relative endpoints. No prompt injection, secret access, obfuscation, reconnaissance, or hidden command behavior was found.

1
Files scanned
803
Lines analyzed
0
Review items
0
False positives ignored
No confirmed security findings were detected by the latest completed static and semantic audit. This does not prove the skill has no side effects.
Audited by: codex View Audit History โ†’
Share & cite this report

Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.

Open versioned report
Security Assessment

Copy report link

https://skillstore.io/skills/sickn33-fp-ts-react/audits/5?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown badge

[![Skillstore security assessment](https://skillstore.io/badges/skills/sickn33-fp-ts-react/security.svg)](https://skillstore.io/skills/sickn33-fp-ts-react?utm_source=security_passport_badge)

HTML badge

<a href="https://skillstore.io/skills/sickn33-fp-ts-react?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/sickn33-fp-ts-react/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Embed card

<iframe src="https://skillstore.io/embed/skills/sickn33-fp-ts-react.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>
Academic citations (APA ยท BibTeX ยท CFF)

APA citation

sickn33. (2026). fp-ts-react security audit report (audit version 5) [Author version unspecified]. Skillstore. https://skillstore.io/skills/sickn33-fp-ts-react/audits/5

BibTeX citation

@techreport{sickn33-sickn33-fp-ts-react-2026, author = {sickn33}, title = {fp-ts-react security audit report (audit version 5)}, institution = {Skillstore}, year = {2026}, number = {5}, url = {https://skillstore.io/skills/sickn33-fp-ts-react/audits/5}, note = {Author version unspecified} }

CITATION.cff

cff-version: 1.2.0 message: "If you use this Skill, cite its author and this versioned security audit report." title: "fp-ts-react security audit report (audit version 5)" version: "unspecified" type: report authors: - name: "sickn33" date-released: "2026-07-23" url: "https://skillstore.io/skills/sickn33-fp-ts-react/audits/5" identifiers: - type: other value: "skillstore:sickn33-fp-ts-react:audit:5" description: "Skillstore immutable audit report identifier"

Skillstore Score

Why this score Evidence Confidence: High
55
Architecture
85
Maintainability
85
Content
68
Community
74
Spec Compliance

What You Can Build

Model Predictable UI State

Replace nullable values and conflicting loading flags with Option and RemoteData.

Validate Complex Forms

Accumulate field errors and preserve typed success values with Either.

Design Testable Service Access

Inject API and analytics services through context and verify components with mocks.

Try These Prompts

Convert Nullable State
Convert this React state from null handling to fp-ts Option and explain each match branch.
Build Form Validation
Create typed Either validators for these fields and return every validation error at once.
Compose API Requests
Refactor these dependent and parallel requests with TaskEither, preserving typed errors and loading states.
Architect Functional Services
Design ReaderTaskEither dependencies, React context wiring, RemoteData rendering, and mock-based tests for this feature.

Best Practices

  • Keep domain errors typed and map them to user messages near the interface.
  • Memoize constructed fp-ts values when React dependency identity matters.
  • Test every tagged state and both branches of Option or Either.

Avoid

  • Do not combine independent loading, data, and error flags that permit impossible states.
  • Do not recreate Option values each render when effects depend on reference identity.
  • Do not cast unvalidated network responses directly into trusted domain types.

Frequently Asked Questions

Which React versions are covered?
The examples cover React 18 and React 19, with notes relevant to Next.js 14 and 15.
Does this skill install fp-ts?
No. It provides patterns and examples, while dependency installation remains a project decision.
Can it collect multiple form errors?
Yes. It demonstrates applicative validation and field-level error structures.
Does TaskEither validate response data?
No. Add runtime validation with io-ts, Zod, or another schema library.
How does it prevent invalid async states?
It models not-started, loading, failure, and success as distinct RemoteData variants.
Can these patterns be tested?
Yes. The dependency injection section demonstrates context providers and mock services for component tests.

Developer Details

Author

sickn33

License

MIT

Skillstore revision

r2

Version notice

The author did not declare a version.

Ref

88a8e9a07f4c54ab105c1c41b6267c287146b07b

Maintenance freshness

7/26/2026

Usage

6 downloads ยท 98 views

File structure

๐Ÿ“„ SKILL.md

More from sickn33

View all
View all