[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6AE42P0QZYETNKHFCYWDH94":3,"skill-same:01M6AE42P0QZYETNKHFCYWDH94":88},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":23,"publishedAt":45,"linkOnly":46,"markdownContent":47,"markdownBody":48,"frontMatter":49,"refName":50,"commitSha":51,"skillDirectory":52,"forksCount":53,"repositoryHtmlUrl":54,"repositoryHomepageUrl":55,"ownerHtmlUrl":56,"ownerBlogUrl":57,"ownerDescription":58,"updatedAt":59,"install":60,"resources":73},"01M6AE42P0QZYETNKHFCYWDH94","react18-lifecycle-patterns",null,"Provides exact before\u002Fafter migration patterns for the three unsafe class component lifecycle methods - componentWillMount, componentWillReceiveProps, and componentWillUpdate - targeting React 18.3.1. Use this skill whenever a class component needs its lifecycle methods migrated, when deciding between getDerivedStateFromProps vs componentDidUpdate, when adding getSnapshotBeforeUpdate, or when fixing React 18 UNSAFE_ lifecycle warnings. Always use this skill before writing any lifecycle migration code - do not guess the pattern from memory, the decision trees here prevent the most common migration mistakes.","github\u002Fawesome-copilot","github","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F9919?v=4","01M6AC83DS133TPXFSP1DHNCC6","GitHub","01M6AD3PBDYPK7NVFJNJ66Y8RS",41133,"MIT","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Freact18-lifecycle-patterns\u002FSKILL.md",[18],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000009","前端开发","SCENARIO","使用场景",[24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44],"react18 lifecycle patterns","lifecycle","patterns","decision trees","when","mistakes","unsafe","for","targeting","trees","three","do","methods","writing","use","common","decision","code","component","react","memory","2026-11-10 10:12:30",false,"---\nname: react18-lifecycle-patterns\ndescription: 'Provides exact before\u002Fafter migration patterns for the three unsafe class component lifecycle methods - componentWillMount, componentWillReceiveProps, and componentWillUpdate - targeting React 18.3.1. Use this skill whenever a class component needs its lifecycle methods migrated, when deciding between getDerivedStateFromProps vs componentDidUpdate, when adding getSnapshotBeforeUpdate, or when fixing React 18 UNSAFE_ lifecycle warnings. Always use this skill before writing any lifecycle migration code - do not guess the pattern from memory, the decision trees here prevent the most common migration mistakes.'\n---\n\n# React 18 Lifecycle Patterns\n\nReference for migrating the three unsafe class component lifecycle methods to React 18.3.1 compliant patterns.\n\n## Quick Decision Guide\n\nBefore migrating any lifecycle method, identify the **semantic category** of what the method does. Wrong category = wrong migration. The table below routes you to the correct reference file.\n\n### componentWillMount - what does it do?\n\n| What it does | Correct migration | Reference |\n|---|---|---|\n| Sets initial state (`this.setState(...)`) | Move to `constructor` | [→ componentWillMount.md](references\u002FcomponentWillMount.md#case-a) |\n| Runs a side effect (fetch, subscription, DOM) | Move to `componentDidMount` | [→ componentWillMount.md](references\u002FcomponentWillMount.md#case-b) |\n| Derives initial state from props | Move to `constructor` with props | [→ componentWillMount.md](references\u002FcomponentWillMount.md#case-c) |\n\n### componentWillReceiveProps - what does it do?\n\n| What it does | Correct migration | Reference |\n|---|---|---|\n| Async side effect triggered by prop change (fetch, cancel) | `componentDidUpdate` | [→ componentWillReceiveProps.md](references\u002FcomponentWillReceiveProps.md#case-a) |\n| Pure state derivation from new props (no side effects) | `getDerivedStateFromProps` | [→ componentWillReceiveProps.md](references\u002FcomponentWillReceiveProps.md#case-b) |\n\n### componentWillUpdate - what does it do?\n\n| What it does | Correct migration | Reference |\n|---|---|---|\n| Reads the DOM before update (scroll, size, position) | `getSnapshotBeforeUpdate` | [→ componentWillUpdate.md](references\u002FcomponentWillUpdate.md#case-a) |\n| Cancels requests \u002F runs effects before update | `componentDidUpdate` with prev comparison | [→ componentWillUpdate.md](references\u002FcomponentWillUpdate.md#case-b) |\n\n---\n\n## The UNSAFE_ Prefix Rule\n\n**Never use `UNSAFE_componentWillMount`, `UNSAFE_componentWillReceiveProps`, or `UNSAFE_componentWillUpdate` as a permanent fix.**\n\nPrefixing suppresses the React 18.3.1 warning but does NOT:\n- Fix concurrent mode safety issues\n- Prepare the codebase for React 19 (where these are removed, with or without the prefix)\n- Fix the underlying semantic problem the migration is meant to address\n\nThe UNSAFE_ prefix is only appropriate as a temporary hold while scheduling the real migration sprint. Mark any UNSAFE_ prefix additions with:\n```jsx\n\u002F\u002F TODO: React 19 will remove this. Migrate before React 19 upgrade.\n\u002F\u002F UNSAFE_ prefix added temporarily - replace with componentDidMount \u002F getDerivedStateFromProps \u002F etc.\n```\n\n---\n\n## Reference Files\n\nRead the full reference file for the lifecycle method you are migrating:\n\n- **`references\u002FcomponentWillMount.md`** - 3 cases with full before\u002Fafter code\n- **`references\u002FcomponentWillReceiveProps.md`** - getDerivedStateFromProps trap warnings, full examples\n- **`references\u002FcomponentWillUpdate.md`** - getSnapshotBeforeUpdate + componentDidUpdate pairing\n\nRead the relevant file before writing any migration code.\n","# React 18 Lifecycle Patterns\n\nReference for migrating the three unsafe class component lifecycle methods to React 18.3.1 compliant patterns.\n\n## Quick Decision Guide\n\nBefore migrating any lifecycle method, identify the **semantic category** of what the method does. Wrong category = wrong migration. The table below routes you to the correct reference file.\n\n### componentWillMount - what does it do?\n\n| What it does | Correct migration | Reference |\n|---|---|---|\n| Sets initial state (`this.setState(...)`) | Move to `constructor` | [→ componentWillMount.md](references\u002FcomponentWillMount.md#case-a) |\n| Runs a side effect (fetch, subscription, DOM) | Move to `componentDidMount` | [→ componentWillMount.md](references\u002FcomponentWillMount.md#case-b) |\n| Derives initial state from props | Move to `constructor` with props | [→ componentWillMount.md](references\u002FcomponentWillMount.md#case-c) |\n\n### componentWillReceiveProps - what does it do?\n\n| What it does | Correct migration | Reference |\n|---|---|---|\n| Async side effect triggered by prop change (fetch, cancel) | `componentDidUpdate` | [→ componentWillReceiveProps.md](references\u002FcomponentWillReceiveProps.md#case-a) |\n| Pure state derivation from new props (no side effects) | `getDerivedStateFromProps` | [→ componentWillReceiveProps.md](references\u002FcomponentWillReceiveProps.md#case-b) |\n\n### componentWillUpdate - what does it do?\n\n| What it does | Correct migration | Reference |\n|---|---|---|\n| Reads the DOM before update (scroll, size, position) | `getSnapshotBeforeUpdate` | [→ componentWillUpdate.md](references\u002FcomponentWillUpdate.md#case-a) |\n| Cancels requests \u002F runs effects before update | `componentDidUpdate` with prev comparison | [→ componentWillUpdate.md](references\u002FcomponentWillUpdate.md#case-b) |\n\n---\n\n## The UNSAFE_ Prefix Rule\n\n**Never use `UNSAFE_componentWillMount`, `UNSAFE_componentWillReceiveProps`, or `UNSAFE_componentWillUpdate` as a permanent fix.**\n\nPrefixing suppresses the React 18.3.1 warning but does NOT:\n- Fix concurrent mode safety issues\n- Prepare the codebase for React 19 (where these are removed, with or without the prefix)\n- Fix the underlying semantic problem the migration is meant to address\n\nThe UNSAFE_ prefix is only appropriate as a temporary hold while scheduling the real migration sprint. Mark any UNSAFE_ prefix additions with:\n```jsx\n\u002F\u002F TODO: React 19 will remove this. Migrate before React 19 upgrade.\n\u002F\u002F UNSAFE_ prefix added temporarily - replace with componentDidMount \u002F getDerivedStateFromProps \u002F etc.\n```\n\n---\n\n## Reference Files\n\nRead the full reference file for the lifecycle method you are migrating:\n\n- **`references\u002FcomponentWillMount.md`** - 3 cases with full before\u002Fafter code\n- **`references\u002FcomponentWillReceiveProps.md`** - getDerivedStateFromProps trap warnings, full examples\n- **`references\u002FcomponentWillUpdate.md`** - getSnapshotBeforeUpdate + componentDidUpdate pairing\n\nRead the relevant file before writing any migration code.\n",{"name":5,"description":7},"main","5269f7ea2d6c3a9bfda5ed878b6726cf509121fd","skills\u002Freact18-lifecycle-patterns",5354,"https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot","https:\u002F\u002Fawesome-copilot.github.com\u002F","https:\u002F\u002Fgithub.com\u002Fgithub","https:\u002F\u002Fgithub.com\u002Fabout","How people build software.","2026-11-14 05:37:52",{"source":8,"skillName":5,"commands":61,"prompt":71,"zipAvailable":72},[62,65,68],{"tool":63,"command":64},"npx","npx skills add github\u002Fawesome-copilot --skill react18-lifecycle-patterns",{"tool":66,"command":67},"bunx","bunx skills add github\u002Fawesome-copilot --skill react18-lifecycle-patterns",{"tool":69,"command":70},"pnpm","pnpm dlx skills add github\u002Fawesome-copilot --skill react18-lifecycle-patterns","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Freact18-lifecycle-patterns\u002FSKILL.md",true,[74,80,84],{"path":75,"resourceType":76,"resourceTypeDesc":77,"sizeBytes":78,"sourceHtmlUrl":79},"references\u002FcomponentWillMount.md","REFERENCE","参考文档",3776,"https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Freact18-lifecycle-patterns\u002Freferences\u002FcomponentWillMount.md",{"path":81,"resourceType":76,"resourceTypeDesc":77,"sizeBytes":82,"sourceHtmlUrl":83},"references\u002FcomponentWillReceiveProps.md",5085,"https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Freact18-lifecycle-patterns\u002Freferences\u002FcomponentWillReceiveProps.md",{"path":85,"resourceType":76,"resourceTypeDesc":77,"sizeBytes":86,"sourceHtmlUrl":87},"references\u002FcomponentWillUpdate.md",4789,"https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Freact18-lifecycle-patterns\u002Freferences\u002FcomponentWillUpdate.md",[89,120,147,176,209,226],{"skillNo":90,"name":91,"nameZh":6,"description":92,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":93,"categories":94,"keywords":101,"publishedAt":45},"01M70KXZNX9ES38N2A8M58ZZMZ","supabase-rls-policies","Write, review, and test Supabase Row Level Security (RLS) policies so that one user cannot read or change another user's rows. Use when creating or changing tables, policies, views, or security definer functions in a Supabase project, when reviewing a migration that touches RLS, or when asked to prove user isolation with pgTAP tests that sign in as two users.","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Fsupabase-rls-policies\u002FSKILL.md",[95,98],{"categoryNo":96,"categoryName":97,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000008","测试与质量",{"categoryNo":99,"categoryName":100,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000023","Skill与智能体开发",[102,103,104,105,106,28,107,108,109,110,111,112,113,114,115,116,38,117,118,119],"supabase","rls","supabase rls","supabase rls policies","project","review","change","read","write","security","isolation","tables","as","tests","prove","users","functions","with",{"skillNo":121,"name":122,"nameZh":6,"description":123,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":124,"categories":125,"keywords":127,"publishedAt":45},"01M70KWA5YWXDV6V8DZ19E3T2Y","skill-distribution-audit","Audit a skill collection before release or investigate installer omissions, archived\u002Ftemplate leakage, duplicate identities, and manifest drift. Reconcile the intended public source set, distribution manifest, and actual discovery output for a specified consumer version. Includes a deterministic set-comparison helper.","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Fskill-distribution-audit\u002FSKILL.md",[126],{"categoryNo":99,"categoryName":100,"taxonomyType":21,"taxonomyTypeDesc":22},[128,129,130,131,132,133,31,134,135,136,137,138,139,140,141,142,143,144,145,146],"distribution","skill distribution audit","audit","SET","deterministic","installer","discovery","comparison","helper","manifest","version","collection","drift","output","investigate","duplicate","template","release","reconcile",{"skillNo":148,"name":149,"nameZh":6,"description":150,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":151,"sourceHtmlUrl":152,"categories":153,"keywords":159,"publishedAt":45},"01M70KCJPFVW7PPQ49CC5R8JGK","logicapps-custom-code-net10-migration","Migrate Azure Logic Apps Standard local-function custom-code projects from .NET 8 to .NET 10. Use for legacy Logic Apps custom-code workspace upgrades, project\u002Fpackage configuration, custom-worker settings, publication, and integrated VS Code debugging. Not for ordinary .NET applications, standalone Azure Functions, Consumption workflows, or cloud deployment.","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Flogicapps-custom-code-net10-migration\u002FLICENSE","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Flogicapps-custom-code-net10-migration\u002FSKILL.md",[154],{"categoryNo":155,"categoryName":156,"taxonomyType":157,"taxonomyTypeDesc":158},"01JBSEEDCAT000000000000030","开发工程师","PROFESSION","适用职业",[160,41,161,162,163,164,31,106,165,166,167,168,169,170,171,38,172,173,174,175],"custom","logicapps custom code net10 migration","migration","projects","standalone","deployment","applications","local","azure","worker","upgrades","package","apps","Legacy","debugging","workflows",{"skillNo":177,"name":178,"nameZh":6,"description":179,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":180,"sourceHtmlUrl":181,"categories":182,"keywords":187,"publishedAt":45},"01M6AEBN37RQMXJ3298PEY7PG1","winmd-api-search","Find and explore Windows desktop APIs. Use when building features that need platform capabilities — camera, file access, notifications, UI controls, AI\u002FML, sensors, networking, etc. Discovers the right API for a task and retrieves full type details (methods, properties, events, enumeration values).","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Fwinmd-api-search\u002FLICENSE.txt","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Fwinmd-api-search\u002FSKILL.md",[183,186],{"categoryNo":184,"categoryName":185,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000010","后端与接口",{"categoryNo":155,"categoryName":156,"taxonomyType":157,"taxonomyTypeDesc":158},[188,189,190,191,192,193,194,195,196,197,198,199,200,201,202,28,203,204,205,206,207,31,36,208],"winmd api search","search","api","windows","desktop","file access","enumeration","ui","ml","file","networking","capabilities","notifications","explore","access","features","full","camera","events","platform","controls",{"skillNo":210,"name":211,"nameZh":6,"description":212,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":213,"licenseFileUrl":214,"sourceHtmlUrl":215,"categories":216,"keywords":222,"publishedAt":45},"01M6AE571R3SC1ZGE202B3NB5S","resemble-detect","Deepfake detection and media safety — detect AI-generated audio, images, video, and text, trace synthesis sources, apply watermarks, verify speaker identity, and analyze media intelligence using Resemble AI","Apache-2.0","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Fresemble-detect\u002FLICENSE","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Fresemble-detect\u002FSKILL.md",[217,218,221],{"categoryNo":184,"categoryName":185,"taxonomyType":21,"taxonomyTypeDesc":22},{"categoryNo":219,"categoryName":220,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000016","图像与多媒体",{"categoryNo":99,"categoryName":100,"taxonomyType":21,"taxonomyTypeDesc":22},[223,131,197,224,225],"resemble detect","https","identity",{"skillNo":227,"name":228,"nameZh":6,"description":229,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":213,"licenseFileUrl":230,"sourceHtmlUrl":231,"categories":232,"keywords":237,"publishedAt":45},"01M6AE30BSK2HCY4TQQ22Z8JRD","quality-playbook","Run a complete quality engineering audit on any codebase. Derives behavioral requirements from the code, generates spec-traced functional tests, runs a three-pass code review with regression tests, executes a multi-model spec audit (Council of Three), and produces a consolidated bug report with TDD-verified patches. Finds the 35% of real defects that structural code review alone cannot catch. Works with any language. Trigger on 'quality playbook', 'spec audit', 'Council of Three', 'fitness-to-purpose', or 'coverage theater'.","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Fquality-playbook\u002FLICENSE.txt","https:\u002F\u002Fgithub.com\u002Fgithub\u002Fawesome-copilot\u002Fblob\u002Fmain\u002Fskills\u002Fquality-playbook\u002FSKILL.md",[233,236],{"categoryNo":234,"categoryName":235,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000007","代码审查",{"categoryNo":99,"categoryName":100,"taxonomyType":21,"taxonomyTypeDesc":22},[238,239,240,241,41,107,9,130,242,243,224,244,245,246,247,248,249,250,251,252,253,34,115,254,255,256,257],"playbook","quality playbook","quality","code review","tdd","run","report","spec","bug report","council","engineering","functional","spec audit","bug","verified","multi-model","coverage","model","regression","structural"]