skills.rest
open-metadata
open-metadataOFFICIAL
Explore all skills by this author →
Website𝕏@open_metadataGitHub

ui-checkstyle

Runs ESLint, Prettier, and organize-imports on changed UI files to match CI checkstyle.

15.1k|2.3k|Updated Aug 1, 2021
Search Tags:#prettier#lint#ci#typeScript#esLint#Git diff#Formatting
One-click install
npx skills add https://github.com/open-metadata/OpenMetadata --skill ui-checkstyle
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-checkstyle
Source: https://github.com/open-metadata/OpenMetadata/tree/main/skills/ui-checkstyle
Command: npx skills add https://github.com/open-metadata/OpenMetadata --skill ui-checkstyle

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The OpenMetadata CI "UI Checkstyle" workflow fails pull requests when changed TypeScript, JavaScript, or JSON files are not formatted exactly as ESLint, Prettier, and organize-imports would produce. This Skill runs the identical sequence locally on only the files your PR changed, so formatting failures are caught and fixed before pushing.

Core Features & Use Cases

  • CI-Identical Lint Sequence: Runs organize-imports, eslint --fix, and prettier --write in the exact order and with the same flags the ui-checkstyle workflow uses.
  • Scoped to Changed Files: Computes the changed-file list from git diff origin/main...HEAD across the src, playwright, and core-components UI trees, skipping areas with no changes.
  • Check-Only Mode: The --check flag performs a dry-run verification that the tree is clean without permanently modifying your working files.
  • Use Case: After editing a React component under openmetadata-ui/src/main/resources/ui/src/, invoke this Skill before committing so the PR passes the required ui-checkstyle status check on the first CI run.

Quick Start

Run the UI checkstyle skill on my changed files and fix any ESLint or Prettier diffs before I push.

Frequently Asked Questions about ui-checkstyle

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fix a UI Checkstyle CI failure on my OpenMetadata PR?▼

Run the same sequence CI runs locally: organize-imports, then eslint --fix, then prettier --write on the files your PR changed. This Skill automates that exact sequence and reports any remaining diff so the ui-checkstyle status check passes.

How do I run ESLint and Prettier only on files changed in my branch?▼

Use git diff --name-only origin/main...HEAD with path filters for the UI source trees to build the changed-file list, then pipe it through xargs to eslint and prettier. The Skill does this automatically per area: src, playwright, and core-components.

Why must Prettier run after organize-imports instead of before?▼

organize-imports-cli outputs 4-space indentation and drops trailing commas, which conflicts with the repo's Prettier config of 2-space indentation and trailing commas. Running Prettier last restores the repo style; reversing the order leaves a dirty diff that fails CI.

Does this skill fix TypeScript type-check errors?▼

No. TypeScript type-check failures from tsc run in separate CI jobs and are out of scope. This Skill only handles formatting and auto-fixable lint issues; hard ESLint errors and tsc errors require real code changes.

Can I verify formatting without modifying my working tree?▼

Yes. Invoke with the --check flag to run the full sequence as a dry-run pass. It reports which files are still dirty and reverts any writes, mirroring how CI verifies a clean tree without touching your changes.

What is the equivalent formatting command for Java or Python code?▼

Java formatting uses mvn spotless:apply via the java-checkstyle skill, and Python uses make py_format with ruff from the ingestion Makefile. This Skill covers only the TypeScript and JavaScript UI trees.

Related Skills

Explore More Software Engineering Skills→
Kord96Kord96

publish

Push the current git branch to origin with optional draft PR and Codex review.

Community
Intermediate
MS33834MS33834

Single-Flow PR Yeet

Stages, commits, pushes, and opens a GitHub pull request for a linear change.

Community
Advanced
ArthTech-AIArthTech-AI

qa

Run full-stack QA checks with pytest, Jest, ruff, TypeScript, and Playwright.

Official
Intermediate
ACuberoACubero

professor

Explain Python code and concepts with cross-language comparisons.

Community
Intermediate