Automated summary
Creates or modifies Next.js Server Actions for the JKKN site following the project's mandatory pattern: 'use server', Zod validation, Supabase server client, auth check, revalidatePath, and activity logging through logActivity.
Strengths
- Enforces non-negotiable project rules (no API routes for CRUD, server-side validation always, auth check before mutating)
- Provides a complete numbered workflow from file placement under app/actions/ to the chosen return type
- Clearly separates the regular Supabase client from the service-role admin client and warns never to expose it to the browser
- Interoperates with the companion admin-crud-pages and database-documentation-workflow skills
Limitations
- Tightly coupled to a specific codebase (JKKN Institution, Supabase, activity table) and not directly portable
- Assumes logActivity, checkPermission, and the Supabase clients already exist in the repo
- The SKILL.md text is truncated at the end, so the database migration hand-off is only partially specified
Use it whenever adding or changing a data-writing function (create/update/delete) under app/actions/ in this Next.js project.
Do not use it for read-only data fetching in a Server Component, or for building the admin page and table that call the action.
Security analysis
SafeThe skill is a project-specific coding pattern document for Next.js Server Actions. It does not execute commands, install packages, exfiltrate secrets, or instruct destructive behavior. It mentions a service-role Supabase client but explicitly restricts it to legitimate admin-only use and warns against client exposure.
No concerns found
How this analysis is madeExamples
Add a server action to create a new placement record for the JKKN site, with Zod validation and activity logging.Wire up the department edit form so it submits through a server action that updates Supabase and revalidates the admin list and public page.Create the delete mutation for testimonials in app/actions/, including an auth check, a checkPermission guard, logActivity, and revalidatePath.name: server-action-pattern description: Create or modify a Next.js Server Action for the JKKN institution website following the project's mandatory pattern. This skill should be used when the user asks to "add a server action", "create a mutation", "wire up a form submit", "add create/update/delete logic", "save/update/delete an entity", or any data-writing function under app/actions/. Enforces the project rule that CRUD uses Server Actions (never API routes): 'use server', Zod validation, the Supabase server client, an auth check, revalidatePath, and activity logging via logActivity. Pairs with admin-crud-pages (which consumes these actions) and database-documentation-workflow (when the action needs a new table).
Server Action Pattern (JKKN Institution Website)
Purpose
Write data-mutating logic the single way this codebase does it. Every file in app/actions/ is a
'use server' module that validates input with Zod, talks to Supabase through the server client,
checks auth, revalidates affected paths, and logs the activity. Following this exactly keeps mutations
secure (server-side validation, RLS-protected) and consistent with ~46 existing action files.
Hard rules (from CLAUDE.md — non-negotiable)
- No API routes for CRUD. All create/update/delete go through Server Actions.
- Server-side validation always. Never trust client input — parse with Zod inside the action.
- Auth check before mutating.
supabase.auth.getUser(); bail if no user. - Activity logging for create/update/delete via
logActivity(or anActivityHelpers.*helper). - Revalidate every path whose data changed with
revalidatePath(...).
When to use
- "Add a server action to save/update/delete X"
- "Wire up this form to submit" / "handle form submission"
- "Create the mutation for <entity>"
- Any new function under
app/actions/(orapp/actions/cms/for CMS-scoped actions)
Do not use for:
- Pure read-only Server Components fetching data inline (no mutation) — though shared read helpers
(
getX) commonly live in the same action file. - Admin page/table scaffolding → use
admin-crud-pages(it calls these actions).
Workflow
Start from templates/server-action.template.ts. Steps:
- Place the file.
app/actions/<entity>.ts, orapp/actions/cms/<entity>.tsfor CMS features. Group reads (getX) and writes (createX,updateX,deleteX) for one entity in one file. 'use server'as the first line.- Import the server client from
@/lib/supabase/server:createServerSupabaseClient()— default; respects the signed-in user + RLS.createAdminSupabaseClient()— service role, bypasses RLS. Use ONLY for admin operations that legitimately must (e.g. creating users). Never expose to the client.
- Define a Zod schema per mutation. Enforce domain rules (e.g. emails end with
@jkkn.ac.invia.refine(...)). - Auth check:
const { data: { user } } = await supabase.auth.getUser(); returnUnauthorizedif missing. - (Optional) permission check:
checkPermission(user.id, 'module:resource:action')from./permissionsfor protected operations. - Validate
formData/args withschema.parse(...)inside atry/catch(catchz.ZodError). - Mutate via Supabase; handle
errorexplicitly. - Log activity with
logActivity({ userId, action, module, resourceType, resourceId, metadata }). revalidatePath(...)for each affected route (e.g. the admin list AND the public page).- Return a typed result. Two shapes exist in the codebase — pick one and be consistent within
the file: simple
{ success: boolean; error?: string; data?: T }(seeapp/actions/videos.ts) or the richerFormStateused withuseActionState/useFormState(seeapp/actions/users.ts).
If the action requires a new table/column/policy, follow database-documentation-workflow FIRST
(document the SQL, then apply the migration) before writing the action.
Verification
npm run buildcompiles.- Unauthenticated call returns the unauthorized result (does not mutate).
- Invalid input returns the Zod message (does not mutate).
- After a successful mutation the list/public page reflects the change (revalidation works).
- A row appears in
user_activity_logs.
Red-flag checklist
- [ ] First line is
'use server'? - [ ] Did I avoid creating an API route for this CRUD?
- [ ] Zod schema validates every input server-side?
- [ ] Auth checked before the mutation?
- [ ]
logActivitycalled for create/update/delete? - [ ]
revalidatePathfor every affected route? - [ ] Consistent return shape within the file?
- [ ] If a new table was needed, did I document+migrate via
database-documentation-workflowfirst?
Bundled resources
templates/server-action.template.ts— full read+create+update+delete action module.references/conventions.md— client choice, return shapes, logActivity enums, permission format.
From the file to a first result
The download contains exactly the content displayed on this page. This copy may differ from the latest version in the source repository.
View the source and supporting filesThis download contains SKILL.md only. Any scripts, references, templates and dependencies are not included. Get the required files from the source, preserving their directory structure, before continuing.
1. Download the file
Download SKILL.mdFrom the root of a test project, save the file as .skill-downloads/next-js-server-action-pattern-msh3us82/SKILL.md, or use the command below. This folder is for inspecting the skill before installation.
Command for macOS/Linux or WSL: requires a POSIX shell and curl. On Windows without WSL, use the download button and create the folder manually.
mkdir -p '.skill-downloads/next-js-server-action-pattern-msh3us82' && curl --fail --show-error --location 'https://skills-guides.com/api/skills/next-js-server-action-pattern-msh3us82/download' --output '.skill-downloads/next-js-server-action-pattern-msh3us82/SKILL.md.part' && mv '.skill-downloads/next-js-server-action-pattern-msh3us82/SKILL.md.part' '.skill-downloads/next-js-server-action-pattern-msh3us82/SKILL.md'2. Check prerequisites
Read SKILL.md before using it. If it references scripts or external services, inspect them and prepare the required access in your test environment.
No recognized prerequisites section in this file. This does not mean it is self-contained: libraries, tools and access requirements may be mentioned elsewhere in the content or source repository.
The platforms on this page are catalog indications. The paths below follow tool documentation; they do not prove this skill has been run in those tools. No minimum tool version is confirmed for this listing.
3. Load the skill
This file does not provide a usable name/description header for this native procedure. It remains available to download and inspect; use the manual method below.
Manual method or another tool: attach SKILL.md to a conversation, or open it in an agent that can read files. Include any required supporting resources. No universal folder is recognized by every tool.
4. Try a first task
Use a short, synthetic input: an API endpoint, a small document or an interface brief. In a new conversation, attach the file or give the agent its path, then adapt this request:
Read .skill-downloads/next-js-server-action-pattern-msh3us82/SKILL.md and apply its instructions to this example: [describe a test input]. Identify any missing files, dependencies or access. Produce the result requested by the skill without inventing data or running unreviewed scripts.Expected result: output matching the skill instructions, or a precise list of missing prerequisites. A read confirmation alone does not validate a first use. If an external resource is unavailable, that path remains untested.
React Hook Form Best Practices
Development
Master React Hook Form: avoid anti-patterns, manage subscriptions, and handle reset, dirty state, and controlled inputs correctly.
Emotion to Mantine Migration
Development
Migrate Emotion styled-components to Mantine components with style props and CSS modules. Use when converting .styled.tsx files or removing @emotion imports.
Scope Creep Detector
Development
Analyzes git diffs against a stated intent to detect scope creep, unrelated files, broad PRs, and oversized changes, then suggests keep, split, or justify actions.