docs: upgrade nuxt-og-image and add nuxt-schema-org#6412
Conversation
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
benjamincanac
changed the title
nuxt-og-image and add nuxt-schema-org
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
📝 WalkthroughWalkthroughAdds a new composable Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes 🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ 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: 1
🧹 Nitpick comments (1)
docs/app/composables/useCanonical.ts (1)
1-2: ⚡ Quick winSplit the Vue type import onto its own line.
This mixes
MaybeRefOrGetterinto a value import, which breaks the repo’s import-style rule.Suggested fix
import { withoutTrailingSlash } from 'ufo' -import { toValue, type MaybeRefOrGetter } from 'vue' +import { toValue } from 'vue' +import type { MaybeRefOrGetter } from 'vue'As per coding guidelines,
**/*.{ts,tsx,vue}: Always use separate type imports:import type { X }on its own line, distinct from regular imports.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/app/composables/useCanonical.ts` around lines 1 - 2, The import currently mixes a value and a type from 'vue'; split them into separate imports so the type uses an `import type` statement: change the combined import that brings in toValue and MaybeRefOrGetter to two lines—one importing the runtime symbol `toValue` and another importing the type `MaybeRefOrGetter` via `import type`—so functions like toValue and the MaybeRefOrGetter type are imported according to the repo's import-style rule.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/app/pages/docs/`[...slug].vue:
- Around line 77-83: The canonical/alternate link is missing the /raw prefix so
useCanonical is pointing at `${path.value}.md` instead of the prerendered
`/raw/...md`; update the code to compute the raw markdown URL (e.g. a computed
rawPath using joinURL('/raw', `${path.value}.md`) or similar) and pass that
rawPath into useCanonical (and reuse the same rawPath for prerenderRoutes) so
both prerenderRoutes(...) and useCanonical(...) reference the identical
`/raw/...md` URL; look for the computed path variable, the prerenderRoutes call
and the useCanonical call to make this change.
---
Nitpick comments:
In `@docs/app/composables/useCanonical.ts`:
- Around line 1-2: The import currently mixes a value and a type from 'vue';
split them into separate imports so the type uses an `import type` statement:
change the combined import that brings in toValue and MaybeRefOrGetter to two
lines—one importing the runtime symbol `toValue` and another importing the type
`MaybeRefOrGetter` via `import type`—so functions like toValue and the
MaybeRefOrGetter type are imported according to the repo's import-style rule.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 5b4af2d3-7fc2-478b-bbd3-b58e649dd998
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (23)
docs/app/app.vuedocs/app/components/og-image/Component.takumi.vuedocs/app/components/og-image/Docs.takumi.vuedocs/app/composables/useCanonical.tsdocs/app/error.vuedocs/app/pages/blog/[...slug].vuedocs/app/pages/blog/index.vuedocs/app/pages/community.vuedocs/app/pages/docs/[...slug].vuedocs/app/pages/index.vuedocs/app/pages/releases.vuedocs/app/pages/showcase.vuedocs/app/pages/team.vuedocs/app/pages/templates.vuedocs/nuxt.config.tsdocs/package.jsondocs/server/plugins/llms.tsdocs/server/routes/.well-known/api-catalog.get.tsdocs/server/routes/.well-known/mcp/server-card.json.get.tsdocs/server/routes/raw/[...slug].md.get.tsdocs/server/routes/raw/index.md.get.tsdocs/server/routes/sitemap.md.get.tsdocs/server/routes/sitemap.xml.get.ts
💤 Files with no reviewable changes (1)
- docs/server/plugins/llms.ts
commit: |
- Add SoftwareApplication schema on homepage and BlogPosting on blog posts - Pass markdown alternate to useCanonical on homepage - Fix Takumi renderer build failures by replacing line-clamp with overflow - Add @unhead/schema-org/vue to vite optimizeDeps - Split type import in useCanonical composable
There was a problem hiding this comment.
🧹 Nitpick comments (1)
docs/app/components/og-image/Docs.takumi.vue (1)
56-56: ⚡ Quick winUse a semantic color token instead of raw palette color.
Line [56] uses
text-slate-500; switch to a semantic token (e.g.text-muted/text-default) to stay consistent with theme semantics.Suggested change
- <p class="text-3xl text-slate-500 overflow-hidden" style="max-height: 5.2em;"> + <p class="text-3xl text-muted overflow-hidden" style="max-height: 5.2em;">As per coding guidelines
**/*.{vue,ts,tsx,md}: Use semantic color names liketext-default,bg-elevated, etc. instead of raw Tailwind palette colors liketext-gray-500.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/app/components/og-image/Docs.takumi.vue` at line 56, Replace the raw Tailwind palette class "text-slate-500" used on the paragraph element in Docs.takumi.vue with the project's semantic color token (for example "text-muted" or "text-default"); locate the <p class="text-3xl text-slate-500 overflow-hidden" ...> element and update its class list to remove "text-slate-500" and add the appropriate semantic token so it follows the project's theming guidelines.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@docs/app/components/og-image/Docs.takumi.vue`:
- Line 56: Replace the raw Tailwind palette class "text-slate-500" used on the
paragraph element in Docs.takumi.vue with the project's semantic color token
(for example "text-muted" or "text-default"); locate the <p class="text-3xl
text-slate-500 overflow-hidden" ...> element and update its class list to remove
"text-slate-500" and add the appropriate semantic token so it follows the
project's theming guidelines.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 35597597-6417-4cb3-b4c8-2a1934a70f36
📒 Files selected for processing (5)
docs/app/components/og-image/Component.takumi.vuedocs/app/components/og-image/Docs.takumi.vuedocs/app/composables/useCanonical.tsdocs/app/pages/blog/[...slug].vuedocs/app/pages/index.vue
✅ Files skipped from review due to trivial changes (2)
- docs/app/components/og-image/Component.takumi.vue
- docs/app/composables/useCanonical.ts
…erved key conflict In nuxt-og-image v6, `component` is a reserved option that overrides the OG component resolution, causing all component pages to fail with "Component not found" errors during prerender.
There was a problem hiding this comment.
♻️ Duplicate comments (1)
docs/app/pages/docs/[...slug].vue (1)
79-83:⚠️ Potential issue | 🟠 Major | ⚡ Quick winMarkdown alternate link still points to a different route than prerendered output.
On Line 80 you prerender
/raw/...md, but on Line 83useCanonical()still receives${path.value}.md(without/raw). This keeps therel="alternate" type="text/markdown"URL inconsistent with the generated route.Suggested fix
const path = computed(() => route.path.replace(/\/$/, '')) +const markdownPath = computed(() => joinURL('/raw', `${path.value}.md`)) if (import.meta.server) { - prerenderRoutes([joinURL('/raw', `${path.value}.md`)]) + prerenderRoutes([markdownPath.value]) } -useCanonical(computed(() => `${path.value}.md`)) +useCanonical(markdownPath)🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/app/pages/docs/`[...slug].vue around lines 79 - 83, The canonical/alternate markdown URL is inconsistent: prerenderRoutes uses joinURL('/raw', `${path.value}.md`) but useCanonical(computed(() => `${path.value}.md`)) omits the /raw prefix. Update useCanonical to produce the same route as prerenderRoutes (use joinURL('/raw', `${path.value}.md`) or conditionally prefix with '/raw' when import.meta.server is true) so the rel="alternate" text/markdown link matches the prerendered output; reference joinURL, prerenderRoutes, useCanonical and path.value when making the change.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Duplicate comments:
In `@docs/app/pages/docs/`[...slug].vue:
- Around line 79-83: The canonical/alternate markdown URL is inconsistent:
prerenderRoutes uses joinURL('/raw', `${path.value}.md`) but
useCanonical(computed(() => `${path.value}.md`)) omits the /raw prefix. Update
useCanonical to produce the same route as prerenderRoutes (use joinURL('/raw',
`${path.value}.md`) or conditionally prefix with '/raw' when import.meta.server
is true) so the rel="alternate" text/markdown link matches the prerendered
output; reference joinURL, prerenderRoutes, useCanonical and path.value when
making the change.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: da6a2d84-a31c-4b00-a76c-39d2105dd660
📒 Files selected for processing (2)
docs/app/components/og-image/Component.takumi.vuedocs/app/pages/docs/[...slug].vue
🚧 Files skipped from review as they are similar to previous changes (1)
- docs/app/components/og-image/Component.takumi.vue
1 participant
🔗 Linked issue
❓ Type of change
📚 Description
📝 Checklist