Pr/integration #456
Pr/integration #456
Conversation
Complete redesign of About page following content plan: - Hero: New headline 'Turning Operational Noise into Engineering Signals' - Origin Story: Split layout with Tel Aviv founding narrative - Philosophy: Three-column grid (Unified Context, Action, AI-Native) - Culture: Engineered for Autonomy section with Remote-First values - Team: Updated with Global Roots heading and locations - Footer CTA: New call-to-action section with Mission Control and Careers links - Typography: Monospace styling for technical keywords (kubectl, GitOps, MCP) - Removed: Old values section and advisors section
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
✅ Deploy Preview for canarychecker canceled.
|
WalkthroughAdds multiple new frontend diagram components and capability UI elements, expands and restructures many Mission Control integration and DB-scraper docs, adjusts linting/build tasks and ignore rules, and updates mission-control dependencies and CSS for diagram visuals. Changes
Possibly related PRs
Pre-merge checks and finishing touches❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (1 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 8
Note
Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
common/src/components/flanksource/About.jsx (1)
7-54: Remove duplicate team member entry."Moshe Immerman" appears twice in the
teamMembersarray:
- Lines 7-13: with role "Founder & CEO" and location "Tel Aviv"
- Lines 43-46: with role "Founder" and no location
This duplication will cause the same person to appear twice on the About page. Please remove one of these entries (likely keep the more complete first entry).
🔎 Proposed fix
image: "/img/flanksource/team/junaid-ebrahim.jpg" }, - { - name: "Moshe Immerman", - role: "Founder", - linkedin: "https://www.linkedin.com/in/moshe-immerman/", - image: "/img/flanksource/team/moshe-immerman.jpg" - }, { name: "Yash Mehrotra", role: "Senior Backend Engineer",
🟡 Minor comments (13)
mission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsx-88-88 (1)
88-88: Fix the double-space typo.There are two spaces between "Kubernetes" and "Site" in the title.
🔎 Proposed fix
- Kubernetes Site Reliability Engineer + Kubernetes Site Reliability Engineercommon/src/components/TerminalOutput.jsx-38-45 (1)
38-45: Remove debugconsole.logstatement.Line 40 contains a debug log that should not be in production code.
🔎 Proposed fix
let copy = command - - console.log("COMMAND:", typeof command) if (Array.isArray(command)) { copy = command.join("\n") command = command.join("<br/>") }mission-control/docs/integrations/email.mdx-63-84 (1)
63-84: Incorrect<details>element syntax.The
summaryattribute on<details>is not standard HTML. The<summary>should be a child element, not an attribute. This may cause rendering issues.```🔎 Proposed fix for all occurrences
-<details summary="Using Connection Reference"> +<details> +<summary>Using Connection Reference</summary> ```yaml title="email-connection-notification.yaml" ...Apply the same pattern to lines 86, 121, and 153.
mission-control/docs/integrations/ldap.mdx-58-83 (1)
58-83: Same<details>syntax issue.Use
<summary>as a child element instead of an attribute.🔎 Proposed fix
-<details summary="User Search Validation"> +<details> +<summary>User Search Validation</summary>Apply to lines 85 and 112 as well.
mission-control/docs/integrations/http.mdx-52-71 (1)
52-71: Same<details>syntax issue as in email.mdx.The
summaryattribute should be a child element, not an attribute.🔎 Proposed fix
-<details summary="JSON Response Validation"> +<details> +<summary>JSON Response Validation</summary>Apply the same fix to lines 73, 89, and 105.
mission-control/docs/integrations/github.mdx-99-100 (1)
99-100: Invalid<details>syntax: use<summary>as a child element.Same issue as in gitlab.mdx—the
summaryattribute is not valid HTML/JSX.🔎 Proposed fix
-<details summary="Workflow with Parameters"> +<details> +<summary>Workflow with Parameters</summary>
mission-control/docs/integrations/gitlab.mdx-64-65 (1)
64-65: Invalid<details>syntax: use<summary>as a child element.The
summaryattribute on<details>is not valid HTML/JSX. The<summary>should be a child element inside<details>.🔎 Proposed fix
-<details summary="Create Merge Request"> +<details> +<summary>Create Merge Request</summary>Apply the same fix to lines 107, 134 for "Self-Hosted GitLab" and "SSH Authentication" sections.
mission-control/docs/integrations/slack.mdx-10-13 (1)
10-13: TOC entry ID mismatch with section heading.The toc entry
{ value: 'Catalog', id: 'catalog', level: 2 }on line 12 won't match the actual section heading generated by<CapabilityHeading type="scraper" />on line 167. The CapabilityHeading likely generates an ID likescraperor similar, notcatalog.Consider aligning the toc entry with the actual section:
🔎 Proposed fix
export const toc = [ { value: 'Notifications', id: 'notifications', level: 2 }, - { value: 'Catalog', id: 'catalog', level: 2 }, + { value: 'Scraper', id: 'scraper', level: 2 }, ];
mission-control/docs/integrations/sql-server.mdx-10-13 (1)
10-13: TOC entry ID mismatch with section heading.Same issue as in
slack.mdx: the toc entry{ value: 'Catalog', id: 'catalog', level: 2 }won't match the section generated by<CapabilityHeading type="scraper" />on line 94.🔎 Proposed fix
export const toc = [ { value: 'Health Checks', id: 'health-checks', level: 2 }, - { value: 'Catalog', id: 'catalog', level: 2 }, + { value: 'Scraper', id: 'scraper', level: 2 }, ];
mission-control/docs/integrations/azure-devops.mdx-81-81 (1)
81-81: Fix the HTML syntax for the details elements.Same issue as line 58 -
summaryshould be a nested element, not an attribute.🔎 Proposed fix
-<details summary="Pattern Matching"> +<details> +<summary>Pattern Matching</summary>-<details summary="Pipeline with Version"> +<details> +<summary>Pipeline with Version</summary>Also applies to: 146-146
mission-control/docs/integrations/azure-devops.mdx-58-58 (1)
58-58: Fix the HTML syntax for the details element.The
summaryattribute should be nested as a<summary>element inside<details>, not as an attribute.🔎 Proposed fix
-<details summary="Pipeline Duration Threshold"> +<details> +<summary>Pipeline Duration Threshold</summary>
mission-control/docs/guide/config-db/scrapers/sql.mdx-14-14 (1)
14-14: Inconsistency in supported database list.The introduction mentions "PostgreSQL, MySQL, and SQL Server" but the Database-Specific Pages section (lines 32-42) lists PostgreSQL, SQL Server, and ClickHouse. Either update the intro to include ClickHouse or add a MySQL-specific page reference.
common/src/components/Shapes.jsx-6-7 (1)
6-7: Incorrect Tailwind CSS syntax for font size.The class
font-size-[15px]is not valid Tailwind syntax. The correct arbitrary value syntax istext-[15px].🔎 Proposed fix
primary: { box: 'fill-blue-500 text-white', - label: 'fill-white font-bold font-size-[15px]', - subtitle: 'text-white font-size-[14px]', + label: 'fill-white font-bold text-[15px]', + subtitle: 'text-white text-[14px]', },Apply the same fix to all other variants (secondary, gray, container, outline) in lines 11-27.
🧹 Nitpick comments (22)
mission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsx (2)
118-118: Improve formatting consistency.The bolding pattern here differs from other requirements. Consider restructuring to match the pattern used in other items (e.g., category in bold followed by description).
🔎 Suggested alternative
- <li><strong>Strong</strong> Experience with GitOps tools - (Flux, ArgoCD)</li> + <li><strong>GitOps Tools</strong> - Strong experience with Flux and ArgoCD</li>
152-191: Consider reordering sections to match sidebar navigation.The tech stack section appears last in the content (after Benefits), but is listed first in the sidebar navigation. This creates a mismatch where the visual order doesn't align with the navigation order, which could confuse users.
Consider either:
- Moving the tech stack section to appear before the Responsibilities section in the content
- Reordering the sidebar navigation to place "Tech Stack" at the end
mission-control/docusaurus.config.ts (1)
149-149: Document the reason for enabling symlink resolution.Enabling
symlinks: trueaffects how Webpack resolves modules and is typically needed for monorepo setups or when usingnpm link/yarn linkduring local development. Please verify this change is intentional and aligns with your development workflow, especially in relation to the new@flanksource/facetdependency..valeignore (1)
1-11: Minor redundancy in ignore patterns.Line 9 (
docs/apm-hub/) is already covered by line 2 (**/apm-hub/**), which matchesapm-hubdirectories at any depth.🔎 Proposed fix
prompts/ **/apm-hub/** **/benchmark* **/development* **/node_modules/** modules/ docs/incidents/ docs-vale-package/ -docs/apm-hub/ scripts/ **/style-guide/mission-control/docs/integrations/mcp.mdx (1)
63-69: Consider adding a security note for long-lived tokens.The token duration of 8760h (1 year) is quite long. Consider adding a note about token rotation best practices or shorter durations for production use.
🔎 Suggested addition
The MCP server requires authentication with the `mcp:run` permission. Create an API token with appropriate RBAC permissions: ```bash kubectl create token mission-control-mcp --duration=8760h
+> Note: For production environments, consider using shorter token durations and implementing token rotation policies.
</details> </blockquote></details> <details> <summary>common/src/components/flanksource/Pricing.jsx (1)</summary><blockquote> `25-25`: **Remove unused Azure import.** The `Azure` import from `@flanksource/icons/mi` is not used anywhere in this file. This was likely part of the icon migration (replacing `SiMicrosoftazure` with the new `Azure` icon), but the icon itself is not rendered in the Pricing component. <details> <summary>🔎 Proposed fix</summary> ```diff -import { Azure } from '@flanksource/icons/mi';mission-control/docs/integrations/aws/config.mdx (1)
7-12: Missingtocexport for consistency with other integration pages.Other integration pages (e.g., gitlab.mdx, opensearch.mdx, github.mdx) export a
tocarray for navigation. Consider adding one here for consistency.🔎 Suggested addition
import { Card, Cards } from '@site/../common/src/components/Card' import { CapabilityBadges, CapabilityBadge, CapabilityHeading } from '@site/../common/src/components/CapabilityBadges' +export const toc = [ + { value: 'Health Checks', id: 'health-checks', level: 2 }, +]; + <CapabilityBadges>mission-control/docs/guide/config-db/scrapers/mssql.mdx (3)
187-230: Consider clarifying the database placeholder.Line 199 uses
YourDatabaseas a placeholder. Consider adding a comment or making it more obvious that users need to replace this with their actual database name.🔎 Suggested improvement
query: | - USE YourDatabase; + USE YourDatabase; -- Replace with your database name SELECT
298-376: Same placeholder issue as Database Users section.Line 324 has the same
USE YourDatabase;placeholder. Consider adding a comment to clarify this needs to be replaced.
535-535: Hardcoded audit file path needs clarification.Line 535 uses a hardcoded Windows path
'C:\SQLAudit\*.sqlaudit'. Consider adding a comment indicating this should be replaced with the actual audit file location.🔎 Suggested improvement
FROM sys.fn_get_audit_file('C:\SQLAudit\*.sqlaudit', DEFAULT, DEFAULT) + -- Replace 'C:\SQLAudit\*.sqlaudit' with your actual audit file path WHERE event_time > DATEADD(HOUR, -1, GETUTCDATE())mission-control/docs/integrations/clickhouse.mdx (1)
112-194: Consider varying sentence structure for better readability.The details summaries at lines 113, 138, and 165 all begin with "Query," which creates a repetitive pattern. This is a minor style issue that could be improved for better readability.
🔎 Suggested improvements
-<details summary="Google Cloud Storage with JSON"> +<details summary="Google Cloud Storage with JSON"> -Query JSON files from Google Cloud Storage. +Read JSON files from Google Cloud Storage buckets. -<details summary="Azure Blob Storage with CSV"> +<details summary="Azure Blob Storage with CSV"> -Query CSV files from Azure Blob Storage using named collections. +Access CSV files from Azure Blob Storage using named collections. -<details summary="Iceberg Tables"> +<details summary="Iceberg Tables"> -Query Iceberg tables for versioned configuration data. +Access Iceberg tables for versioned configuration data.Based on learnings from static analysis hints.
common/src/components/ArchitectureDiagram.tsx (2)
59-79: Dynamic Tailwind classes may not work with JIT compilation.The regex-based dynamic class construction on lines 60-61 (
border-${bgMatch[1]}-${bgMatch[2]}) won't be detected by Tailwind's JIT compiler, as it scans for complete class strings. These dynamically constructed classes may be purged from the final CSS bundle.Additionally, line 73 has a redundant ternary that always evaluates to
'p-3'.🔎 Proposed fix
function BoxNode({ id, title, className = '', bodyClassName = '', border = 'solid', children }: BoxNodeProps) { - const bgMatch = className.match(/bg-(\w+)-(\d+)/); - const borderClass = bgMatch ? `border-${bgMatch[1]}-${bgMatch[2]}` : 'border-slate-300'; + // Use a mapping of bg classes to border classes to ensure Tailwind JIT includes them + const borderClassMap: Record<string, string> = { + 'bg-slate-500': 'border-slate-500', + 'bg-blue-600': 'border-blue-600', + }; + const borderClass = borderClassMap[className.split(' ').find(c => c.startsWith('bg-')) || ''] || 'border-slate-300'; const borderStyle = `border-2 ${border === 'dashed' ? 'border-dashed' : 'border-solid'} ${borderClass}`; const hasHeader = title !== undefined; return ( <div id={id} className={`rounded-xl overflow-hidden shadow-lg min-w-[120px] ${borderStyle}`}> {hasHeader && ( <div className={`px-3 py-2 text-center ${className}`}> <span className="text-white text-xs font-bold">{title}</span> </div> )} {children && ( - <div className={`${bodyClassName} ${hasHeader ? 'p-3' : 'p-3'}`}> + <div className={`${bodyClassName} p-3`}> {children} </div> )} </div> ); }
171-174: Unusedvariantprop.The
variantprop is defined in the interface and passed through the component chain but is never used inArchitectureDiagramInner. Consider removing it if not needed, or document its intended future use.common/src/components/CatalogDiagram.tsx (3)
4-27: Unused import:Gcp.The
Gcpicon is imported on line 13 but never used in the component. The component usesGoogleCloudinstead (line 88).🔎 Proposed fix
import { Github, AzureDevops, Gitlab, Aws, Terraform, Azure, ConfigDbWhite, K8S, - Gcp, Flux, Argo, Prometheus, Datadog, Dynatrace, AwsCloudwatch, Opensearch, Postgres, SqlServer, GoogleCloud, AzureAd, AwsCloudtrail, Clickhouse, } from '@flanksource/icons/mi';
29-65: Consider extracting shared diagram primitives.
IconGridandBoxNodeare duplicated betweenCatalogDiagram.tsxandArchitectureDiagram.tsx. While the implementations differ slightly (e.g.,BoxNodeheader handling), extracting these to a shared module would improve maintainability and ensure consistent styling across diagrams.
55-65: Dynamic Tailwind classes may not work with JIT compilation.Same issue as in
ArchitectureDiagram.tsx: the regex-based dynamic class construction (border-${bgMatch[1]}-${bgMatch[2]}) won't be detected by Tailwind's JIT compiler. Consider using a static class mapping.mission-control/docs/integrations/sql-server.mdx (1)
44-47: Use placeholder credentials in connection string examples.The example connection string contains a literal
passwordvalue. While this is clearly an example, users may copy it directly. Consider using a more explicit placeholder pattern to encourage proper secret management.🔎 Proposed fix
mssql: - name: production-db - url: sqlserver://user:password@sqlserver:1433?database=mydb + url: sqlserver://$(username):$(password)@sqlserver:1433?database=mydb + # Or use connection reference: + # connection: connection://mssql/production query: SELECT 1common/src/components/CapabilityBadges.jsx (1)
40-46: Consider distinct styling for the 'relationship' capability.The 'relationship' capability uses the same icon (ConfigDb) as 'scraper' and nearly identical colors to 'healthcheck' (amber/yellow). This could cause visual confusion when both badges appear together.
Suggestion: Use distinct colors and icon
Consider using a different color scheme and icon to make 'relationship' visually distinct:
'relationship': { - icon: ConfigDb, + icon: /* Consider a relationship-specific icon */, label: 'Relationship', - color: '#d97706', - bg: '#fef3c7', - border: '#fcd34d' + color: '#0891b2', // cyan + bg: '#cffafe', + border: '#67e8f9' }common/src/components/HowItWorksDiagram.tsx (1)
244-250: Add proper TypeScript typing to the DownArrow component.The
classNameparameter is destructured without type annotation. For consistency with the rest of the file's TypeScript usage, add proper typing.🔎 Proposed fix
-const DownArrow = ({ className }) => ( +const DownArrow = ({ className }: { className?: string }) => ( <div className={className}> <svg width="16" height="12" viewBox="0 0 16 12"> <path d="M8 12 L0 0 L16 0 Z" fill="currentColor" /> </svg> </div> );common/src/components/Shapes.jsx (3)
78-103:flexDirectionprop is declared but column layout is not implemented.The component accepts
flexDirectionprop but the positioning logic only implements row-based layout. WhenflexDirection="column"is passed, children will still be positioned horizontally.🔎 Proposed fix for column layout support
if (flexWrap === 'wrap' && propWidth) { if (currentX + childWidth + padding > x + propWidth) { currentX = x + padding; currentY += currentRowHeight + gap; currentRowHeight = 0; } } const finalX = currentX; const finalY = currentY; - currentX += childWidth + gap; - currentRowHeight = Math.max(currentRowHeight, childHeight); + if (flexDirection === 'column') { + currentY += childHeight + gap; + currentRowHeight = childHeight; + } else { + currentX += childWidth + gap; + currentRowHeight = Math.max(currentRowHeight, childHeight); + }
61-62: PropsalignItemsandjustifyContentare declared but never used.These layout props are accepted but have no effect on the component's behavior. Consider implementing the alignment logic or removing these props to avoid a misleading API.
105-106: Edge case: empty children array results in minimal dimensions.If
childrenis an empty array[], it's truthy so the calculation usesmaxX - x + padding, butmaxXremains 0, resulting inwidth = padding(10px). Consider checking for actual child count:🔎 Proposed fix
-const width = propWidth ?? (children ? maxX - x + padding : 120); -const height = propHeight ?? (children ? maxY - y + padding : 40); +const hasChildren = React.Children.count(children) > 0; +const width = propWidth ?? (hasChildren ? maxX - x + padding : 120); +const height = propHeight ?? (hasChildren ? maxY - y + padding : 40);
📜 Review details
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (9)
mission-control/package-lock.jsonis excluded by!**/package-lock.jsonmission-control/static/img/about/action-not-observation.svgis excluded by!**/*.svgmission-control/static/img/about/ai-native.svgis excluded by!**/*.svgmission-control/static/img/about/async-by-design.svgis excluded by!**/*.svgmission-control/static/img/about/open-source-first.svgis excluded by!**/*.svgmission-control/static/img/about/output-over-hours.svgis excluded by!**/*.svgmission-control/static/img/about/unified-context.svgis excluded by!**/*.svgmission-control/static/img/architecture.svgis excluded by!**/*.svgmission-control/static/img/born-in-terminal.pngis excluded by!**/*.png
📒 Files selected for processing (62)
.gitignore.valeignoreTaskfile.ymlcanary-checker/docs/partials/_domain.mdxcanary-checker/docs/partials/_integration_prereqs.mdxcommon/src/components/ArchitectureDiagram.tsxcommon/src/components/CapabilityBadges.jsxcommon/src/components/Card.jsxcommon/src/components/CatalogDiagram.tsxcommon/src/components/HowItWorksDiagram.tsxcommon/src/components/Shapes.jsxcommon/src/components/TerminalOutput.jsxcommon/src/components/flanksource/About.jsxcommon/src/components/flanksource/MissionControlPage.jsxcommon/src/components/flanksource/Pricing.jsxcommon/src/components/flanksource/Services.jsxcommon/src/css/custom.cssmission-control/.gitignoremission-control/docs/architecture.mdxmission-control/docs/guide/config-db/scrapers/clickhouse.mdxmission-control/docs/guide/config-db/scrapers/mssql.mdxmission-control/docs/guide/config-db/scrapers/postgres.mdxmission-control/docs/guide/config-db/scrapers/sql.mdxmission-control/docs/integrations/_template.mdxmission-control/docs/integrations/argo.mdxmission-control/docs/integrations/aws/config.mdxmission-control/docs/integrations/aws/index.mdmission-control/docs/integrations/aws/index.mdxmission-control/docs/integrations/azure-ad.mdxmission-control/docs/integrations/azure-devops.mdxmission-control/docs/integrations/azure.mdxmission-control/docs/integrations/clickhouse.mdxmission-control/docs/integrations/crossplane.mdxmission-control/docs/integrations/email.mdxmission-control/docs/integrations/flux/index.mdmission-control/docs/integrations/flux/index.mdxmission-control/docs/integrations/flux/playbooks.mdmission-control/docs/integrations/gcp.mdxmission-control/docs/integrations/github.mdxmission-control/docs/integrations/gitlab.mdxmission-control/docs/integrations/grafana.mdxmission-control/docs/integrations/helm.mdxmission-control/docs/integrations/http.mdxmission-control/docs/integrations/index.mdxmission-control/docs/integrations/kubernetes/index.mdmission-control/docs/integrations/kubernetes/index.mdxmission-control/docs/integrations/kustomize/index.mdxmission-control/docs/integrations/ldap.mdxmission-control/docs/integrations/loki.mdxmission-control/docs/integrations/mcp.mdxmission-control/docs/integrations/opensearch.mdxmission-control/docs/integrations/postgres.mdxmission-control/docs/integrations/prometheus.mdxmission-control/docs/integrations/slack.mdxmission-control/docs/integrations/sql-server.mdxmission-control/docs/integrations/teams.mdxmission-control/docs/integrations/terraform.mdxmission-control/docs/integrations/trivy.mdxmission-control/docusaurus.config.tsmission-control/package.jsonmission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsxstyles/.vale-config/3-MDX.ini
💤 Files with no reviewable changes (4)
- mission-control/docs/integrations/aws/index.md
- mission-control/docs/integrations/kubernetes/index.md
- mission-control/docs/integrations/flux/index.md
- styles/.vale-config/3-MDX.ini
🧰 Additional context used
📓 Path-based instructions (4)
**/*.{js,ts,tsx,jsx,py,java,cs,cpp,c,go,rb,php,scala,kotlin,swift}
📄 CodeRabbit inference engine (.cursor/rules/global.mdc)
Do not write comments in code unless the implementation is not clear
Files:
common/src/components/Shapes.jsxcommon/src/components/CapabilityBadges.jsxcommon/src/components/flanksource/Services.jsxcommon/src/components/CatalogDiagram.tsxcommon/src/components/flanksource/Pricing.jsxcommon/src/components/HowItWorksDiagram.tsxcommon/src/components/TerminalOutput.jsxmission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsxcommon/src/components/ArchitectureDiagram.tsxcommon/src/components/flanksource/About.jsxmission-control/docusaurus.config.tscommon/src/components/Card.jsxcommon/src/components/flanksource/MissionControlPage.jsx
**/*.{js,ts,tsx,jsx,json}
📄 CodeRabbit inference engine (.cursor/rules/global.mdc)
Use only the following icons from the available icon library: access-denied.svg, activemq.svg, activity-feed-o.svg, activity-feed.svg, activity.svg, add-alarm-clock.svg, add-alarm.svg, add-alert.svg, add-certificate.svg, add-clock.svg, add-cloud.svg, add-cost.svg, add-database.svg, add-disk.svg, add-email.svg, add-firewall.svg, add-folder.svg, add-group.svg, add-heart.svg, add-inbox.svg, add-key.svg, add-list.svg, add-network-card.svg, add-node.svg, add-page.svg, add-properties.svg, add-receipt.svg, add-shield.svg, add-snapshot.svg, add-tag.svg, add-ticket.svg, add-user.svg, add.svg, and 500+ additional icons from the icon library
Files:
common/src/components/Shapes.jsxcommon/src/components/CapabilityBadges.jsxcommon/src/components/flanksource/Services.jsxcommon/src/components/CatalogDiagram.tsxcommon/src/components/flanksource/Pricing.jsxcommon/src/components/HowItWorksDiagram.tsxcommon/src/components/TerminalOutput.jsxmission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsxcommon/src/components/ArchitectureDiagram.tsxcommon/src/components/flanksource/About.jsxmission-control/docusaurus.config.tscommon/src/components/Card.jsxmission-control/package.jsoncommon/src/components/flanksource/MissionControlPage.jsx
**/*.{md,markdown,txt}
📄 CodeRabbit inference engine (.cursor/rules/global.mdc)
**/*.{md,markdown,txt}: Use Google Style Guide (https://developers.google.com/style) for documentation and writing style
Use active voice; never use passive voice
Files:
mission-control/docs/integrations/flux/playbooks.md
**/*.md
📄 CodeRabbit inference engine (AGENTS.md)
**/*.md: Runmake fmtto format Markdown with Prettier before committing changes
Runmake lintwith Vale and markdownlint to lint documentation before committing changes
Documentation should follow Google style using second person, active voice, and present tense
Files:
mission-control/docs/integrations/flux/playbooks.md
🧠 Learnings (4)
📚 Learning: 2025-12-05T13:02:08.910Z
Learnt from: CR
Repo: flanksource/docs PR: 0
File: .cursor/rules/global.mdc:0-0
Timestamp: 2025-12-05T13:02:08.910Z
Learning: Applies to **/*.{js,ts,tsx,jsx,json} : Use only the following icons from the available icon library: access-denied.svg, activemq.svg, activity-feed-o.svg, activity-feed.svg, activity.svg, add-alarm-clock.svg, add-alarm.svg, add-alert.svg, add-certificate.svg, add-clock.svg, add-cloud.svg, add-cost.svg, add-database.svg, add-disk.svg, add-email.svg, add-firewall.svg, add-folder.svg, add-group.svg, add-heart.svg, add-inbox.svg, add-key.svg, add-list.svg, add-network-card.svg, add-node.svg, add-page.svg, add-properties.svg, add-receipt.svg, add-shield.svg, add-snapshot.svg, add-tag.svg, add-ticket.svg, add-user.svg, add.svg, and 500+ additional icons from the icon library
Applied to files:
common/src/components/CapabilityBadges.jsxcommon/src/components/flanksource/Services.jsxcommon/src/components/flanksource/Pricing.jsx.valeignore
📚 Learning: 2025-12-05T13:02:17.776Z
Learnt from: CR
Repo: flanksource/docs PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-05T13:02:17.776Z
Learning: Applies to **/*.md : Run `make lint` with Vale and markdownlint to lint documentation before committing changes
Applied to files:
.valeignoreTaskfile.yml
📚 Learning: 2025-12-05T13:02:17.776Z
Learnt from: CR
Repo: flanksource/docs PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-05T13:02:17.776Z
Learning: Add new tool names and acronyms to `styles/ignore/words-with-suggestions.txt` to prevent linting errors
Applied to files:
.valeignore
📚 Learning: 2025-12-05T13:02:17.776Z
Learnt from: CR
Repo: flanksource/docs PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-05T13:02:17.776Z
Learning: Applies to **/*.md : Run `make fmt` to format Markdown with Prettier before committing changes
Applied to files:
Taskfile.yml
🧬 Code graph analysis (3)
common/src/components/Shapes.jsx (2)
mission-control/src/theme/MDXComponents/Details.js (2)
children(10-10)items(4-4)scripts/mdx-renderer/process-mdx.mjs (1)
icon(68-68)
common/src/components/flanksource/About.jsx (1)
common/src/components/Shapes.jsx (1)
g(118-203)
common/src/components/flanksource/MissionControlPage.jsx (4)
common/src/components/flanksource/Navigation.jsx (1)
Navigation(6-574)common/src/components/ArchitectureDiagram.tsx (1)
ArchitectureDiagram(218-224)common/src/components/CatalogDiagram.tsx (1)
CatalogDiagram(218-224)common/src/components/HowItWorksDiagram.tsx (1)
HowItWorksDiagram(363-369)
🪛 LanguageTool
mission-control/docs/integrations/kubernetes/index.mdx
[grammar] ~67-~67: Ensure spelling is correct
Context: ...ooks. Use cases: - Restart pods or rollout deployments automatically - Scale deplo...
(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_1)
mission-control/docs/integrations/aws/config.mdx
[style] ~46-~46: Three successive sentences begin with the same word. Consider rewording the sentence or use a thesaurus to find a synonym.
Context: ...0 # No public buckets allowed ``` ### Query with Aggregator Use a Configuration Ag...
(ENGLISH_WORD_REPEAT_BEGINNING_RULE)
mission-control/docs/integrations/gitlab.mdx
[uncategorized] ~173-~173: The official name of this software platform is spelled with a capital “H”.
Context: ...service | Git service type: gitlab, github, or azure | | accessToken | GitLab...
(GITHUB)
mission-control/docs/integrations/argo.mdx
[grammar] ~34-~34: Ensure spelling is correct
Context: ...se cases:** - Discover Applications and ApplicationSets with their sync status and health state...
(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_1)
mission-control/docs/integrations/index.mdx
[uncategorized] ~27-~27: The official name of this software platform is spelled with a capital “H”.
Context: ...ocs/integrations/flux/) | | ✓ | | ✓ | | GitHub ...
(GITHUB)
[uncategorized] ~27-~27: The official name of this software platform is spelled with a capital “H”.
Context: ... | | ✓ | | GitHub | ✓ | ✓ | | ✓ | | <Icon name="gitlab"/...
(GITHUB)
mission-control/docs/integrations/clickhouse.mdx
[style] ~113-~113: Three successive sentences begin with the same word. Consider rewording the sentence or use a thesaurus to find a synonym.
Context: ...mary="Google Cloud Storage with JSON"> Query JSON files from Google Cloud Storage. ...
(ENGLISH_WORD_REPEAT_BEGINNING_RULE)
[style] ~138-~138: Three successive sentences begin with the same word. Consider rewording the sentence or use a thesaurus to find a synonym.
Context: ...summary="Azure Blob Storage with CSV"> Query CSV files from Azure Blob Storage using...
(ENGLISH_WORD_REPEAT_BEGINNING_RULE)
[style] ~165-~165: Three successive sentences begin with the same word. Consider rewording the sentence or use a thesaurus to find a synonym.
Context: ...s>
Details
Query Iceberg tables for versioned configurat...(ENGLISH_WORD_REPEAT_BEGINNING_RULE)
[style] ~331-~331: Three successive sentences begin with the same word. Consider rewording the sentence or use a thesaurus to find a synonym.
Context: ...etails summary="HTTP/URL Data Source"> Query JSON or CSV files from any HTTP endpoin...
(ENGLISH_WORD_REPEAT_BEGINNING_RULE)
| @@ -1,4 +1,4 @@ | |||
| Choose a routable `DOMAIN` for Mission Control | |||
| > See [Ingress](/docs/installation/self-hosted/ingress) for more options on configuring the ingress including generating certs with cert-manager | |||
| > See [Ingress](/docs/installation/self-hosted) for more options on configuring the ingress including generating certs with cert-manager | |||
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
# First, explore the documentation directory structure
fd -t f -e md -e mdx "self-hosted" docs/ --exec basename {} \;
# Also check the full directory structure
find docs/installation -type f -o -type d 2>/dev/null | head -30Repository: flanksource/docs
Length of output: 42
🏁 Script executed:
# Check if docs directory exists and explore its structure
ls -la docs/ 2>/dev/null | head -20
# List all directories in docs
find docs -type d -maxdepth 3 2>/dev/null | sort | head -30
# Search for any ingress-related documentation
rg -l "ingress" docs/ --type md --type mdx 2>/dev/null | head -20Repository: flanksource/docs
Length of output: 993
🏁 Script executed:
# Explore canary-checker directory structure
find docs/canary-checker -type f -o -type d 2>/dev/null | sort
# Check if the file being reviewed exists
cat -n docs/canary-checker/docs/partials/_domain.mdx 2>/dev/null
# Search for any installation or ingress related files
find docs/canary-checker -name "*installation*" -o -name "*ingress*" 2>/dev/nullRepository: flanksource/docs
Length of output: 192
🏁 Script executed:
# Search for _domain.mdx file across entire repository
find . -name "*domain*" -type f 2>/dev/null
# Search for installation documentation anywhere
find . -path "*/installation/*" -type f 2>/dev/null | head -20
# Search for any ingress documentation
rg "ingress" --type md --type mdx -l 2>/dev/null | head -20Repository: flanksource/docs
Length of output: 1171
🏁 Script executed:
# Read the file being reviewed
cat -n ./canary-checker/docs/partials/_domain.mdx
# List all installation files
ls -la ./canary-checker/docs/installation/
# Search for self-hosted related files
find . -name "*self-hosted*" -type f 2>/dev/null
# Search for ingress in canary-checker
rg "ingress" ./canary-checker --type md --type mdx -l 2>/dev/nullRepository: flanksource/docs
Length of output: 892
🏁 Script executed:
# Read the installation index to see what's there
cat -n ./canary-checker/docs/installation/index.md
# Read the helm installation file
cat -n ./canary-checker/docs/installation/1-helm.canary.md | head -50
# Check if any installation file mentions ingress or self-hosted
rg "ingress|self.hosted" ./canary-checker/docs/installation/ --type md --type mdx -i -A 2 -B 2Repository: flanksource/docs
Length of output: 1912
🏁 Script executed:
# Use find with exec to read all installation files
find ./canary-checker/docs/installation -type f \( -name "*.md" -o -name "*.mdx" \) -exec cat {} +
# Check if there are any other self-hosted related docs in the entire canary-checker repo
find ./canary-checker -type f \( -name "*.md" -o -name "*.mdx" \) -exec grep -l "self.hosted\|ingress" {} \; 2>/dev/nullRepository: flanksource/docs
Length of output: 6487
🏁 Script executed:
# Check the slug/title of cli.mdx to understand the URL pattern
head -20 ./canary-checker/docs/installation/cli.mdx
# Check all installation files for their slug definitions
grep -A 5 "^slug:" ./canary-checker/docs/installation/*.md* 2>/dev/nullRepository: flanksource/docs
Length of output: 1441
🏁 Script executed:
# Check what links are used in _domain.mdx file to understand the path pattern
cat -n ./canary-checker/docs/partials/_domain.mdx
# Check other files in canary-checker that link to installation pages
rg "/docs/installation" ./canary-checker --type md --type mdx -B 1 -A 1 | head -40Repository: flanksource/docs
Length of output: 451
🏁 Script executed:
# Check if local-testing documentation exists
find . -name "*local*testing*" -type f 2>/dev/null
# Check all files in canary-checker/docs with their paths
find ./canary-checker/docs -type f \( -name "*.md" -o -name "*.mdx" \)
# Look for any files that might be the self-hosted or local-testing docs
ls -la ./canary-checker/docs/installation/Repository: flanksource/docs
Length of output: 4591
Both link targets do not exist in the canary-checker documentation.
The links at /docs/installation/self-hosted and /docs/installation/local-testing do not correspond to any documentation files in the canary-checker installation directory. Ingress configuration information is available in the Helm installation guide (/docs/installation/helm), but the links as currently written are broken and will fail to resolve for users.
🤖 Prompt for AI Agents
In canary-checker/docs/partials/_domain.mdx around line 2, the two link targets
(/docs/installation/self-hosted and /docs/installation/local-testing) do not
exist and therefore break docs; replace them with valid targets (for example
point the Ingress link to /docs/installation/helm which contains ingress
configuration and update or remove the local-testing link—if you need a
local-testing reference, create or point to the correct existing page path), and
ensure the link text and URL are consistent so the MDX resolves properly.
| FaClock, | ||
| FaHeadset | ||
| } from 'react-icons/fa'; | ||
| import { SiKubernetes, SiPrometheus, SiGrafana, SiTerraform, SiHelm, SiArgo, SiGitlab, SiGithub, SiDocker, SiAmazonaws, SiPostgresql, SiMicrosoftazure, SiGooglecloud } from 'react-icons/si'; |
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major
Remove unused icon imports.
Line 27 imports SiAmazonaws and SiMicrosoftazure from react-icons/si, but these are no longer used since:
- Line 122 now uses
SiAmazonwebservicesinstead ofSiAmazonaws - Line 123 now uses
Azurecomponent instead ofSiMicrosoftazure
🔎 Proposed fix to remove unused imports
-import { SiKubernetes, SiPrometheus, SiGrafana, SiTerraform, SiHelm, SiArgo, SiGitlab, SiGithub, SiDocker, SiAmazonaws, SiPostgresql, SiMicrosoftazure, SiGooglecloud } from 'react-icons/si';
+import { SiKubernetes, SiPrometheus, SiGrafana, SiTerraform, SiHelm, SiArgo, SiGitlab, SiGithub, SiDocker, SiAmazonwebservices, SiPostgresql, SiGooglecloud } from 'react-icons/si';📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| import { SiKubernetes, SiPrometheus, SiGrafana, SiTerraform, SiHelm, SiArgo, SiGitlab, SiGithub, SiDocker, SiAmazonaws, SiPostgresql, SiMicrosoftazure, SiGooglecloud } from 'react-icons/si'; | |
| import { SiKubernetes, SiPrometheus, SiGrafana, SiTerraform, SiHelm, SiArgo, SiGitlab, SiGithub, SiDocker, SiAmazonwebservices, SiPostgresql, SiGooglecloud } from 'react-icons/si'; |
🤖 Prompt for AI Agents
In common/src/components/flanksource/Services.jsx around line 27, the import
statement includes SiAmazonaws and SiMicrosoftazure which are no longer used
(the file now uses SiAmazonwebservices and the Azure component instead); remove
SiAmazonaws and SiMicrosoftazure from the named imports from 'react-icons/si' so
the import list only contains the actually used icons (SiKubernetes,
SiPrometheus, SiGrafana, SiTerraform, SiHelm, SiArgo, SiGitlab, SiGithub,
SiDocker, SiPostgresql, SiGooglecloud, SiAmazonwebservices if present) to
eliminate unused imports and keep the file clean.
| javascript: |+ | ||
| var data = JSON.parse(config.data); | ||
| var result = { | ||
| id: data.server_name, | ||
| name: data.server_name, | ||
| config: { | ||
| version: data.version, | ||
| edition: data.edition | ||
| }, | ||
| external_users: data.logins.map(function(l) { | ||
| return { | ||
| name: l.name, | ||
| account_id: l.principal_id, | ||
| user_type: l.type_desc.toLowerCase().replace(' ', '_'), | ||
| aliases: [l.sid] | ||
| }; | ||
| }), | ||
| external_roles: data.server_roles.map(function(r) { | ||
| return { | ||
| name: r.name, | ||
| account_id: r.principal_id, | ||
| role_type: 'server_role', | ||
| description: r.is_fixed_role ? 'Fixed server role' : 'User-defined server role' | ||
| }; | ||
| }), | ||
| external_user_groups: data.role_members.map(function(m) { | ||
| return { | ||
| external_user_id: m.member_principal_id, | ||
| external_group_id: m.role_principal_id | ||
| }; | ||
| }) | ||
| }; | ||
| JSON.stringify([result]) |
There was a problem hiding this comment.
Missing return statement in JavaScript transform.
Line 142 should return the stringified result. Without the return statement, the transform will produce undefined output.
🔎 Proposed fix
};
- JSON.stringify([result])
+ return JSON.stringify([result])🤖 Prompt for AI Agents
In mission-control/docs/guide/config-db/scrapers/mssql.mdx around lines 110 to
142, the JavaScript transform builds the result object but does not return it;
add a return statement before the final JSON.stringify([result]) so the
transformed string is actually returned from the function (ensure the line reads
like a return of the stringified array).
| javascript: |+ | ||
| var events = config.audit_events || []; | ||
| var result = { | ||
| id: 'mssql_audit', | ||
| name: config.server_name, | ||
| config: { server: config.server_name }, | ||
| changes: events.filter(function(e) { | ||
| return ['SCHEMA_OBJECT_CHANGE_GROUP', 'DATABASE_OBJECT_CHANGE_GROUP'].indexOf(e.action_id) >= 0; | ||
| }).map(function(e) { | ||
| return { | ||
| external_change_id: e.event_time + '_' + e.action_id, | ||
| change_type: e.action_id, | ||
| summary: e.statement, | ||
| created_by: e.server_principal_name, | ||
| created_at: e.event_time, | ||
| details: { | ||
| database: e.database_name, | ||
| object: e.object_name, | ||
| schema: e.schema_name | ||
| } | ||
| }; | ||
| }), | ||
| access_logs: events.filter(function(e) { | ||
| return ['SELECT', 'INSERT', 'UPDATE', 'DELETE', 'EXECUTE'].indexOf(e.action_id) >= 0; | ||
| }).map(function(e) { | ||
| return { | ||
| external_user_id: e.server_principal_name, | ||
| created_at: e.event_time, | ||
| properties: { | ||
| action: e.action_id, | ||
| database: e.database_name, | ||
| object: e.object_name, | ||
| client_ip: e.client_ip, | ||
| application: e.application_name | ||
| } | ||
| }; | ||
| }) | ||
| }; | ||
| JSON.stringify([result]) |
There was a problem hiding this comment.
Missing return statement in JavaScript transform.
Line 519 should return the stringified result, same issue as in the Logins and Users section.
🔎 Proposed fix
})
};
- JSON.stringify([result])
+ return JSON.stringify([result])📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| javascript: |+ | |
| var events = config.audit_events || []; | |
| var result = { | |
| id: 'mssql_audit', | |
| name: config.server_name, | |
| config: { server: config.server_name }, | |
| changes: events.filter(function(e) { | |
| return ['SCHEMA_OBJECT_CHANGE_GROUP', 'DATABASE_OBJECT_CHANGE_GROUP'].indexOf(e.action_id) >= 0; | |
| }).map(function(e) { | |
| return { | |
| external_change_id: e.event_time + '_' + e.action_id, | |
| change_type: e.action_id, | |
| summary: e.statement, | |
| created_by: e.server_principal_name, | |
| created_at: e.event_time, | |
| details: { | |
| database: e.database_name, | |
| object: e.object_name, | |
| schema: e.schema_name | |
| } | |
| }; | |
| }), | |
| access_logs: events.filter(function(e) { | |
| return ['SELECT', 'INSERT', 'UPDATE', 'DELETE', 'EXECUTE'].indexOf(e.action_id) >= 0; | |
| }).map(function(e) { | |
| return { | |
| external_user_id: e.server_principal_name, | |
| created_at: e.event_time, | |
| properties: { | |
| action: e.action_id, | |
| database: e.database_name, | |
| object: e.object_name, | |
| client_ip: e.client_ip, | |
| application: e.application_name | |
| } | |
| }; | |
| }) | |
| }; | |
| JSON.stringify([result]) | |
| javascript: |+ | |
| var events = config.audit_events || []; | |
| var result = { | |
| id: 'mssql_audit', | |
| name: config.server_name, | |
| config: { server: config.server_name }, | |
| changes: events.filter(function(e) { | |
| return ['SCHEMA_OBJECT_CHANGE_GROUP', 'DATABASE_OBJECT_CHANGE_GROUP'].indexOf(e.action_id) >= 0; | |
| }).map(function(e) { | |
| return { | |
| external_change_id: e.event_time + '_' + e.action_id, | |
| change_type: e.action_id, | |
| summary: e.statement, | |
| created_by: e.server_principal_name, | |
| created_at: e.event_time, | |
| details: { | |
| database: e.database_name, | |
| object: e.object_name, | |
| schema: e.schema_name | |
| } | |
| }; | |
| }), | |
| access_logs: events.filter(function(e) { | |
| return ['SELECT', 'INSERT', 'UPDATE', 'DELETE', 'EXECUTE'].indexOf(e.action_id) >= 0; | |
| }).map(function(e) { | |
| return { | |
| external_user_id: e.server_principal_name, | |
| created_at: e.event_time, | |
| properties: { | |
| action: e.action_id, | |
| database: e.database_name, | |
| object: e.object_name, | |
| client_ip: e.client_ip, | |
| application: e.application_name | |
| } | |
| }; | |
| }) | |
| }; | |
| return JSON.stringify([result]) |
🤖 Prompt for AI Agents
In mission-control/docs/guide/config-db/scrapers/mssql.mdx around lines 481 to
519, the JavaScript transform builds the result object but does not return it —
JSON.stringify([result]) is evaluated but not returned. Fix by adding a return
statement so the transform returns the stringified array (i.e., return
JSON.stringify([result]);), ensuring the transform function returns the value as
in the Logins and Users section.
| import { Card, Cards } from '@site/../common/src/components/Card' | ||
| import Helm from '@site/../common/src/components/Helm.jsx' | ||
| import Schema from '@site/modules/mission-control-registry/charts/helm/values.schema.json' | ||
| import Prereqs from '@site/docs/partials/_integration_prereqs.mdx' | ||
| import { CapabilityBadges, CapabilityBadge, CapabilityHeading } from '@site/../common/src/components/CapabilityBadges' |
There was a problem hiding this comment.
Missing Screenshot import causes runtime error.
The Screenshot component is used on line 79 but is not imported. This will cause a runtime error when the page is rendered.
🔎 Proposed fix
import { Card, Cards } from '@site/../common/src/components/Card'
import Helm from '@site/../common/src/components/Helm.jsx'
import Schema from '@site/modules/mission-control-registry/charts/helm/values.schema.json'
import Prereqs from '@site/docs/partials/_integration_prereqs.mdx'
import { CapabilityBadges, CapabilityBadge, CapabilityHeading } from '@site/../common/src/components/CapabilityBadges'
+import Screenshot from '@site/../common/src/components/Screenshot'📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| import { Card, Cards } from '@site/../common/src/components/Card' | |
| import Helm from '@site/../common/src/components/Helm.jsx' | |
| import Schema from '@site/modules/mission-control-registry/charts/helm/values.schema.json' | |
| import Prereqs from '@site/docs/partials/_integration_prereqs.mdx' | |
| import { CapabilityBadges, CapabilityBadge, CapabilityHeading } from '@site/../common/src/components/CapabilityBadges' | |
| import { Card, Cards } from '@site/../common/src/components/Card' | |
| import Helm from '@site/../common/src/components/Helm.jsx' | |
| import Schema from '@site/modules/mission-control-registry/charts/helm/values.schema.json' | |
| import Prereqs from '@site/docs/partials/_integration_prereqs.mdx' | |
| import { CapabilityBadges, CapabilityBadge, CapabilityHeading } from '@site/../common/src/components/CapabilityBadges' | |
| import Screenshot from '@site/../common/src/components/Screenshot' |
🤖 Prompt for AI Agents
In mission-control/docs/integrations/helm.mdx around lines 7 to 11, the
Screenshot component is used later (line 79) but not imported, causing a runtime
error; add an import for Screenshot from the correct common components path
(matching other component imports in this file) at the top of the file alongside
the existing imports so the component is available when the page renders.
| limit: 100 | ||
| ``` | ||
| <details summary="Query with Authentication"> |
There was a problem hiding this comment.
Fix incorrect HTML syntax for details element.
The <details> element uses invalid syntax. It should contain a <summary> child element, not a summary attribute.
🔎 Proposed fix
-<details summary="Query with Authentication">
+<details>
+<summary>Query with Authentication</summary>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <details summary="Query with Authentication"> | |
| <details> | |
| <summary>Query with Authentication</summary> |
🤖 Prompt for AI Agents
In mission-control/docs/integrations/loki.mdx around line 55, the <details> tag
is using an invalid summary attribute; replace the single tag <details
summary="Query with Authentication"> with a proper <details> element that
contains a nested <summary>Query with Authentication</summary>, and ensure the
details block is closed with </details> after its content so the markup is
valid.
| ``` | ||
| </details> | ||
| <details summary="Dynamic Query Based on Context"> |
There was a problem hiding this comment.
Fix incorrect HTML syntax for details element.
Same issue as Line 55 - the <details> element requires a <summary> child element, not a summary attribute.
🔎 Proposed fix
-<details summary="Dynamic Query Based on Context">
+<details>
+<summary>Dynamic Query Based on Context</summary>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <details summary="Dynamic Query Based on Context"> | |
| <details> | |
| <summary>Dynamic Query Based on Context</summary> |
🤖 Prompt for AI Agents
In mission-control/docs/integrations/loki.mdx around line 83, the details
element uses a summary attribute instead of a summary child; replace the single
tag <details summary="Dynamic Query Based on Context"> with a proper pair: open
<details>, add a child <summary>Dynamic Query Based on Context</summary>, then
the original content and a closing </details> to ensure valid HTML semantics.
| ``` | ||
| </details> | ||
| <details summary="Stream Logs"> |
There was a problem hiding this comment.
Fix incorrect HTML syntax for details element.
Same issue - the <details> element requires a <summary> child element, not a summary attribute.
🔎 Proposed fix
-<details summary="Stream Logs">
+<details>
+<summary>Stream Logs</summary>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <details summary="Stream Logs"> | |
| <details> | |
| <summary>Stream Logs</summary> |
🤖 Prompt for AI Agents
In mission-control/docs/integrations/loki.mdx around line 107, the <details>
element incorrectly uses a summary attribute; replace it with a child <summary>
element by removing the summary="Stream Logs" attribute and adding a
<summary>Stream Logs</summary> element immediately inside the <details> tag,
ensuring the details block is properly closed.
There was a problem hiding this comment.
Actionable comments posted: 4
Fix all issues with AI Agents 🤖
In @common/src/components/flanksource/Pricing.jsx:
- Line 1: Pricing.jsx currently imports icons from react-icons/fa; replace those
imports with the corresponding exports from @flanksource/icons/mi and update any
renamed imports to match the @flanksource/icons naming (e.g., use Check, Times,
ChevronDown, ChevronUp, ArrowRight, Database, ChartLine, Bell, Server, Lock,
Rocket, QuestionCircle, InfoCircle from @flanksource/icons/mi). Locate the
import statement(s) at the top of Pricing.jsx and swap the module source to
"@flanksource/icons/mi", ensure any destructured icon names match the
centralized Icon.jsx/mi naming conventions used elsewhere (Services.jsx,
Navigation.jsx), and remove any unused react-icons imports. Verify the component
renders unchanged and run linter/tests to confirm no unresolved imports remain.
In @mission-control/docusaurus.config.ts:
- Around line 112-128: Remove the stale include pattern /\/facet\/src\// from
the TS/TSX rule in docusaurus.config.ts: locate the rule that tests
/\.(ts|tsx)$/ which currently has an include array containing
/node_modules\/@flanksource\/facet/ and /\/facet\/src\//, and delete the
/\/facet\/src\// entry so only /node_modules\/@flanksource\/facet/ remains; keep
the babel-loader/options/presets block unchanged.
In @mission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsx:
- Around line 86-88: The heading string contains a typographical error with two
spaces between "Kubernetes" and "Site" ("Kubernetes Site Reliability
Engineer"); update the JSX/markup where that string is defined (the heading text
in this component) to use a single space ("Kubernetes Site Reliability
Engineer") so the title displays correctly.
- Line 118: The list item breaks the established "<strong>Category</strong> -
description" pattern by bolding "Strong" instead of the category; update the
item text so the category is bolded and the description follows (e.g., change
'<li><strong>Strong</strong> Experience with GitOps tools - (Flux, ArgoCD)</li>'
to '<li><strong>Experience</strong> - Strong experience with GitOps tools (Flux,
ArgoCD)</li>') so it matches the other requirement entries.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
mission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsx (1)
38-43: Section ordering mismatch between navigation and content.The sidebar lists "Tech Stack" first, but the actual section appears last in the page content (after Benefits at line 152). This will cause confusing scroll behavior and incorrect active section highlighting as users navigate.
Either move the tech-stack section to appear first in the content, or reorder the sidebar navigation to match the content order.
🔎 Option 1: Reorder sidebar to match content
{[ - { id: 'tech-stack', label: 'Tech Stack' }, { id: 'responsibilities', label: 'Responsibilities' }, { id: 'requirements', label: 'Requirements' }, { id: 'nice-to-haves', label: 'Nice-to-haves' }, - { id: 'benefits', label: 'Benefits' } + { id: 'benefits', label: 'Benefits' }, + { id: 'tech-stack', label: 'Tech Stack' } ].map((section) => (
📜 Review details
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
common/src/components/flanksource/Pricing.jsxcommon/src/components/flanksource/Services.jsxmission-control/docusaurus.config.tsmission-control/package.jsonmission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
- common/src/components/flanksource/Services.jsx
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{js,ts,tsx,jsx,json}
📄 CodeRabbit inference engine (.cursor/rules/global.mdc)
Use only the following icons from the available icon library: access-denied.svg, activemq.svg, activity-feed-o.svg, activity-feed.svg, activity.svg, add-alarm-clock.svg, add-alarm.svg, add-alert.svg, add-certificate.svg, add-clock.svg, add-cloud.svg, add-cost.svg, add-database.svg, add-disk.svg, add-email.svg, add-firewall.svg, add-folder.svg, add-group.svg, add-heart.svg, add-inbox.svg, add-key.svg, add-list.svg, add-network-card.svg, add-node.svg, add-page.svg, add-properties.svg, add-receipt.svg, add-shield.svg, add-snapshot.svg, add-tag.svg, add-ticket.svg, add-user.svg, add.svg, and 500+ additional icons from the icon library
Files:
mission-control/package.jsonmission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsxmission-control/docusaurus.config.tscommon/src/components/flanksource/Pricing.jsx
**/*.{js,ts,tsx,jsx,py,java,cs,cpp,c,go,rb,php,scala,kotlin,swift}
📄 CodeRabbit inference engine (.cursor/rules/global.mdc)
Do not write comments in code unless the implementation is not clear
Files:
mission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsxmission-control/docusaurus.config.tscommon/src/components/flanksource/Pricing.jsx
🔇 Additional comments (8)
mission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsx (5)
5-6: LGTM!Icon imports are appropriate and all are utilized in the tech-stack section below.
100-112: LGTM!Responsibilities section is well-structured.
130-138: LGTM!Nice-to-haves section is appropriate.
152-191: Well-implemented tech stack section.The responsive grid layout and the favorite heart indicators provide a clean, engaging UI for showcasing the technology stack. Good use of the icon library.
219-239: LGTM!Styles are well-structured with appropriate hover effects and responsive breakpoints.
common/src/components/flanksource/Pricing.jsx (1)
2-16: No action required – react-icons/fa is an approved project dependency.The import cleanup is correct. Both
react-icons(v5.2.1) and@flanksource/iconsare established project dependencies in mission-control/package.json. The pattern of usingreact-icons/fadirectly is already used elsewhere in the codebase (e.g., Services.jsx), so this aligns with existing patterns. No migration to@flanksource/iconsis necessary unless the broader PR context indicates a specific requirement.Likely an incorrect or invalid review comment.
mission-control/package.json (2)
51-54: Babel dependency versions are compatible. Docusaurus 3.7.0 uses webpack 5.95.0, which exceeds babel-loader 10.0.0's minimum requirement of webpack 5.61.0. Babel 7.28.5 supports the automatic JSX runtime and is fully compatible with React 18. No action needed.
21-22: All specified package versions exist and have no known security vulnerabilities. The dependencies (@flanksource/facet, @flanksource/icons, react-xarrows, reactflow) are available on npm and installable. Note that @flanksource/facet@0.1.3 is marked as the official latest release by its maintainer, not an alpha/beta version.
| @@ -1,13 +1,7 @@ | |||
| import React, { useState } from 'react'; | |||
| import { useState } from 'react'; | |||
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
# Find and check package.json for React version
fd -type f -name "package.json" -exec cat {} \; | head -100Repository: flanksource/docs
Length of output: 230
🏁 Script executed:
# Read the Pricing.jsx file to verify the imports and their usage
cat -n common/src/components/flanksource/Pricing.jsx | head -50Repository: flanksource/docs
Length of output: 1730
🏁 Script executed:
# Search for @flanksource/icons usage in the codebase to understand migration status
rg "@flanksource/icons" --type js --type jsxRepository: flanksource/docs
Length of output: 87
🏁 Script executed:
# Verify react-icons usage across the codebase
rg "from.*react-icons" --type js --type jsx | head -20Repository: flanksource/docs
Length of output: 87
🏁 Script executed:
# Find package.json files and extract React version
find . -name "package.json" -type f | head -5 | xargs -I {} sh -c 'echo "File: {}"; cat {} | grep -A 2 '"'"'"react'"'"'"' | head -5'Repository: flanksource/docs
Length of output: 128
🏁 Script executed:
# Check for @flanksource/icons usage in codebase
rg "@flanksource/icons"Repository: flanksource/docs
Length of output: 3480
🏁 Script executed:
# Verify icon usage in Pricing.jsx - search for FaCheck, FaTimes, etc.
rg "FaCheck|FaTimes|FaChevronDown|FaChevronUp|FaArrowRight|FaDatabase|FaChartLine|FaBell|FaServer|FaLock|FaRocket|FaQuestionCircle|FaInfoCircle" common/src/components/flanksource/Pricing.jsxRepository: flanksource/docs
Length of output: 1871
🏁 Script executed:
# Check the full Pricing.jsx to see how icons are used
cat common/src/components/flanksource/Pricing.jsx | wc -lRepository: flanksource/docs
Length of output: 63
🏁 Script executed:
# Check if equivalent icons exist in @flanksource/icons by examining Icon.jsx
cat common/src/components/Icon.jsx | head -100Repository: flanksource/docs
Length of output: 4334
🏁 Script executed:
# Search for how Check, Times, and other icons are named in @flanksource/icons
rg "Check|Times|Chevron|ArrowRight|Database|ChartLine|Bell|Server|Lock|Rocket|Question|Info" common/src/components/flanksource/ | grep -i "flanksource/icons"Repository: flanksource/docs
Length of output: 228
Migrate icon imports from react-icons/fa to @flanksource/icons/mi to comply with coding guidelines.
The React import cleanup is correct for React 17+. However, the component still uses react-icons/fa which violates the project's icon library guidelines. Per the coding guidelines, only icons from the available icon library (including access-denied.svg, activemq.svg, and 500+ additional icons from @flanksource/icons) should be used. The codebase has established a pattern of migrating to @flanksource/icons/mi as seen in Services.jsx, Navigation.jsx, and the centralized Icon.jsx component. All icons used in Pricing.jsx (Check, Times, ChevronDown, ChevronUp, ArrowRight, Database, ChartLine, Bell, Server, Lock, Rocket, QuestionCircle, InfoCircle) have equivalent names in @flanksource/icons and should be imported from there instead.
🤖 Prompt for AI Agents
In @common/src/components/flanksource/Pricing.jsx around line 1, Pricing.jsx
currently imports icons from react-icons/fa; replace those imports with the
corresponding exports from @flanksource/icons/mi and update any renamed imports
to match the @flanksource/icons naming (e.g., use Check, Times, ChevronDown,
ChevronUp, ArrowRight, Database, ChartLine, Bell, Server, Lock, Rocket,
QuestionCircle, InfoCircle from @flanksource/icons/mi). Locate the import
statement(s) at the top of Pricing.jsx and swap the module source to
"@flanksource/icons/mi", ensure any destructured icon names match the
centralized Icon.jsx/mi naming conventions used elsewhere (Services.jsx,
Navigation.jsx), and remove any unused react-icons imports. Verify the component
renders unchanged and run linter/tests to confirm no unresolved imports remain.
| { | ||
| test: /\.(ts|tsx)$/, | ||
| include: [ | ||
| /node_modules\/@flanksource\/facet/, | ||
| /\/facet\/src\// | ||
| ], | ||
| use: { | ||
| loader: 'babel-loader', | ||
| options: { | ||
| presets: [ | ||
| '@babel/preset-env', | ||
| ['@babel/preset-react', { runtime: 'automatic' }], | ||
| '@babel/preset-typescript', | ||
| ], | ||
| }, | ||
| }, | ||
| }, |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
# First, let's explore the repository structure to understand the project layout
fd -type d -name "facet" --max-depth 3Repository: flanksource/docs
Length of output: 230
🏁 Script executed:
# Check the docusaurus.config.ts file to understand the full webpack configuration context
cat -n mission-control/docusaurus.config.ts | head -150Repository: flanksource/docs
Length of output: 6062
🏁 Script executed:
# Look for any TypeScript files that might match the /facet/src/ pattern
fd -e ts -e tsx . --max-depth 4 | grep -i facet | head -20Repository: flanksource/docs
Length of output: 42
🏁 Script executed:
# Check if node_modules/@flanksource/facet exists
ls -la node_modules/@flanksource/ 2>/dev/null | head -20 || echo "node_modules not available in sandbox"Repository: flanksource/docs
Length of output: 42
🏁 Script executed:
# Check for facet directory at various levels
fd -d "facet" --type d --max-depth 5Repository: flanksource/docs
Length of output: 180
🏁 Script executed:
# Look for any facet references in configuration files
rg "facet" --type json --type yaml --type toml -l | head -20Repository: flanksource/docs
Length of output: 122
🏁 Script executed:
# Check the git configuration to see if there are submodules or special configurations
cat .gitmodules 2>/dev/null || echo "No .gitmodules file"
git config --file .git/config --name-only --get-regexp path 2>/dev/null | head -10 || echo "No git worktree configuration"Repository: flanksource/docs
Length of output: 1231
🏁 Script executed:
# Look at the directory structure at the root level
ls -la | grep -E "^d" | head -20Repository: flanksource/docs
Length of output: 964
🏁 Script executed:
# Check mission-control/package.json for facet dependency
cat mission-control/package.json | jq '.dependencies, .devDependencies' 2>/dev/null || cat mission-control/package.json | grep -A 5 -B 5 "facet"Repository: flanksource/docs
Length of output: 1624
🏁 Script executed:
# Search for any facet references in the codebase
rg "facet" --type ts --type tsx --type js --type jsx -i | head -30Repository: flanksource/docs
Length of output: 87
🏁 Script executed:
# Check if facet/src is referenced anywhere
rg "facet/src" -i | head -20Repository: flanksource/docs
Length of output: 42
🏁 Script executed:
# Search for imports of facet to understand usage
rg "@flanksource/facet" -i | head -20Repository: flanksource/docs
Length of output: 579
🏁 Script executed:
# Check if there's any facet directory at all in the repository
find . -type d -name "*facet*" 2>/dev/nullRepository: flanksource/docs
Length of output: 42
Remove the unused /\/facet\/src\// include pattern.
The second include pattern /\/facet\/src\// targets a local facet/src directory that does not exist in this repository. The @flanksource/facet package is only used as an npm dependency (version ^0.1.3), and the first pattern /node_modules\/@flanksource\/facet/ already correctly handles transpiling the published package.
This pattern appears to be leftover from a previous workflow (the package-lock.json shows a historical local file reference). Remove the second pattern to prevent confusion and maintain a cleaner configuration.
🤖 Prompt for AI Agents
In @mission-control/docusaurus.config.ts around lines 112-128, Remove the stale
include pattern /\/facet\/src\// from the TS/TSX rule in docusaurus.config.ts:
locate the rule that tests /\.(ts|tsx)$/ which currently has an include array
containing /node_modules\/@flanksource\/facet/ and /\/facet\/src\//, and delete
the /\/facet\/src\// entry so only /node_modules\/@flanksource\/facet/ remains;
keep the babel-loader/options/presets block unchanged.
| marginBottom: '1rem' | ||
| }}> | ||
| Site Reliability Engineer | ||
| Kubernetes Site Reliability Engineer |
There was a problem hiding this comment.
Typographical error: double space in heading.
There's an extra space between "Kubernetes" and "Site" in the heading.
🔎 Proposed fix
- Kubernetes Site Reliability Engineer
+ Kubernetes Site Reliability Engineer📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| marginBottom: '1rem' | |
| }}> | |
| Site Reliability Engineer | |
| Kubernetes Site Reliability Engineer | |
| marginBottom: '1rem' | |
| }}> | |
| Kubernetes Site Reliability Engineer |
🤖 Prompt for AI Agents
In @mission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsx
around lines 86-88, The heading string contains a typographical error with two
spaces between "Kubernetes" and "Site" ("Kubernetes Site Reliability
Engineer"); update the JSX/markup where that string is defined (the heading text
in this component) to use a single space ("Kubernetes Site Reliability
Engineer") so the title displays correctly.
| <h2 style={{ fontSize: '24px', fontWeight: 700, marginBottom: '1rem' }}>Requirements</h2> | ||
| <ul style={{ lineHeight: 1.8 }}> | ||
| <li><strong>Deep Kubernetes expertise</strong> - CKA certification preferred</li> | ||
| <li><strong>Strong</strong> Experience with GitOps tools - (Flux, ArgoCD)</li> |
There was a problem hiding this comment.
Inconsistent formatting pattern in requirements list.
This item breaks the formatting pattern used by other items (e.g., <strong>Category</strong> - description). The word "Strong" is bolded but "Experience" follows as regular text, which reads awkwardly.
🔎 Proposed fix
- <li><strong>Strong</strong> Experience with GitOps tools - (Flux, ArgoCD)</li>
+ <li><strong>GitOps</strong> - Strong experience with Flux and ArgoCD</li>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <li><strong>Strong</strong> Experience with GitOps tools - (Flux, ArgoCD)</li> | |
| <li><strong>GitOps</strong> - Strong experience with Flux and ArgoCD</li> |
🤖 Prompt for AI Agents
In @mission-control/src/pages/careers/kubernetes-site-reliability-engineer.tsx
around line 118, The list item breaks the established "<strong>Category</strong>
- description" pattern by bolding "Strong" instead of the category; update the
item text so the category is bolded and the description follows (e.g., change
'<li><strong>Strong</strong> Experience with GitOps tools - (Flux, ArgoCD)</li>'
to '<li><strong>Experience</strong> - Strong experience with GitOps tools (Flux,
ArgoCD)</li>') so it matches the other requirement entries.
Summary by CodeRabbit
New Features
Documentation
Improvements
✏️ Tip: You can customize this high-level summary in your review settings.