# Poo Fix

> >

- **Type:** Skill
- **Install:** `agentstack add skill-keysjoao-poo-skills-poo-fix`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [keysjoao](https://agentstack.voostack.com/s/keysjoao)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [keysjoao](https://github.com/keysjoao)
- **Source:** https://github.com/keysjoao/poo-skills/tree/main/poo-fix

## Install

```sh
agentstack add skill-keysjoao-poo-skills-poo-fix
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# POO Fix — Consolidate Duplicates

Refactors identified duplicate code into shared, reusable components following OOP/SOLID principles.

## Input

Either:
- Results from `/poo audit` (list of duplicate pairs)
- User pointing at specific files ("esses dois componentes fazem a mesma coisa")
- A file path to analyze

## Workflow

### Step 1: Analyze the Duplicates

For each duplicate pair:
1. Read BOTH files completely
2. Identify:
   - **Shared logic** (identical or near-identical code)
   - **Differences** (props, styling, edge cases)
   - **Dependencies** (what each imports)

### Step 2: Design the Shared Abstraction

Choose the right pattern:

| Pattern | When to Use | Example |
|---------|------------|---------|
| **Shared Component** | Same UI, minor prop differences | `` |
| **Composition** | Same structure, different content | `` |
| **Custom Hook** | Same logic, different UI | `useDownload()` returns `{download, loading, error}` |
| **Utility Function** | Same operation, no UI | `formatCurrency(value, locale)` |
| **Base Class/Interface** | Same contract, different implementations | `interface DataExporter { export(): void }` |
| **Higher-Order Component** | Same wrapper behavior | `withAuth(Component)` |
| **Render Props / Slots** | Same logic, totally different UI | ` ...}/>` |

### Step 3: Determine Location

```
1. Check if shared directory exists:
   Glob: **/components/shared/** OR **/components/ui/** OR **/components/common/**

2. If not, check project conventions:
   - Next.js: components/ at root or src/components/
   - React: src/components/shared/
   - Vue: src/components/common/

3. For utilities: utils/ or lib/
4. For hooks: hooks/ or composables/ (Vue)
5. For types: types/ or interfaces/
```

### Step 4: Build the Shared Code

1. Create the shared component/utility with ALL variants:
   - Use props/params to handle differences
   - Add TypeScript types for all variants
   - Export from a clean index file

2. Update ALL consumers:
   - Replace duplicate imports with shared import
   - Pass appropriate props/params
   - Delete the old duplicate files

3. Verify nothing breaks:
   - Check all imports resolve
   - Check TypeScript compiles
   - Run existing tests if available

### Step 5: Report Changes

```markdown
## POO Fix Report

### Created
- `components/shared/DownloadButton.tsx` — unified download button

### Updated (now using shared component)
- `pages/reports/index.tsx` — was: local DownloadBtn, now: shared DownloadButton
- `pages/exports/index.tsx` — was: local ExportDownload, now: shared DownloadButton

### Deleted (duplicates removed)
- `pages/reports/components/DownloadBtn.tsx`
- `pages/exports/components/ExportDownload.tsx`

### Props/Variants Added
- `variant`: "primary" | "secondary" | "icon-only"
- `format`: "csv" | "xlsx" | "pdf"

### Lines Saved: ~120 lines (2 files → 1 shared)
```

## Refactoring Rules

1. **Never break existing functionality** — the refactored code must work identically
2. **Preserve all edge cases** — if one version handles an edge case, the shared version must too
3. **Use TypeScript generics** when the types differ between consumers
4. **Add JSDoc comments** explaining props/params that exist to support specific consumers
5. **Run type check after** — `npx tsc --noEmit` to verify
6. **Update barrel exports** — if the project uses index.ts re-exports

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [keysjoao](https://github.com/keysjoao)
- **Source:** [keysjoao/poo-skills](https://github.com/keysjoao/poo-skills)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-keysjoao-poo-skills-poo-fix
- Seller: https://agentstack.voostack.com/s/keysjoao
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.