Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: allow to disable content head #2142

Merged
merged 9 commits into from
Aug 23, 2023
Merged

feat: allow to disable content head #2142

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
a32fbe0
feat: allow to disable content head
Barbapapazes Jul 5, 2023
59b383b
docs: update api
Barbapapazes Jul 5, 2023
bbdfa4d
Update src/module.ts
Barbapapazes Jul 6, 2023
27d6b4c
fix: use review comments
Barbapapazes Jul 29, 2023
c78dfd8
Merge branch 'main' into feat/allow-to-disable-content-head
Barbapapazes Jul 29, 2023
57960ac
fix: lint
Barbapapazes Jul 29, 2023
bd17c03
fix: types
Barbapapazes Jul 29, 2023
c9e3837
Merge branch 'main' into feat/allow-to-disable-content-head
farnabaz Aug 23, 2023
0e39984
Update docs/content/4.api/3.configuration.md
farnabaz Aug 23, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
9 changes: 8 additions & 1 deletion docs/content/4.api/3.configuration.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export default defineNuxtConfig({
- Type: `Record<String, any>`{lang=ts}
- Default: `{ baseURL: '/api/_content' }`{lang=ts}

Change default behaviour of Content APIs.
Change default behaviour of Content APIs.

- `baseURL`{lang=ts}: change the base URL of Content APIs. Default is `/api/_content`.

Expand Down Expand Up @@ -366,6 +366,13 @@ Default locale for top level contents. Module will use first locale code from `l
Note that in case of defining multiple locales, Module will filter content with `defaultLocale`. If you want to fetch contents of another locale, you need to use `where` option.
::

## `enableContentHead`

- Type: `Boolean`{lang=ts}
farnabaz marked this conversation as resolved.
Show resolved Hide resolved
- Default: `true`{lang=ts}

Enable content head feature. If enabled, module will automatically use `useContentHead` composable to inject content head data to your page.

## `documentDriven`

- Type: `Boolean | Object`{lang=ts}
Expand Down
1 change: 1 addition & 0 deletions playground/custom-seo/content/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
# Content
11 changes: 11 additions & 0 deletions playground/custom-seo/nuxt.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
export default defineNuxtConfig({
extends: ['../shared'],

content: {
enableContentHead: false
},

typescript: {
includeWorkspace: true
}
})
16 changes: 16 additions & 0 deletions playground/custom-seo/pages/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
<script lang="ts" setup>
useServerHead({
title: 'My custom title',
meta: [
{
hid: 'description',
name: 'description',
content: 'My custom description'
}
]
})
</script>

<template>
<ContentDoc />
</template>
10 changes: 10 additions & 0 deletions src/module.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -203,6 +203,12 @@ export interface ModuleOptions {
* @default undefined
*/
defaultLocale?: string
/**
* Ignore automatic usage of `useContentHead`
Barbapapazes marked this conversation as resolved.
Show resolved Hide resolved
*
* @default true
*/
enableContentHead?: boolean
/**
* Document-driven mode config
*
Expand Down Expand Up @@ -280,6 +286,7 @@ export default defineNuxtModule<ModuleOptions>({
navigation: {
fields: []
},
enableContentHead: true,
documentDriven: false,
experimental: {
clientDB: false,
Expand Down Expand Up @@ -617,6 +624,7 @@ export default defineNuxtModule<ModuleOptions>({
documentDriven: options.documentDriven as any,
host: typeof options.documentDriven !== 'boolean' ? options.documentDriven?.host ?? '' : '',
trailingSlash: typeof options.documentDriven !== 'boolean' ? options.documentDriven?.trailingSlash ?? false : false,
enableContentHead: options.enableContentHead,
// Anchor link generation config
anchorLinks: options.markdown.anchorLinks as { depth?: number, exclude?: number[] }
})
Expand Down Expand Up @@ -746,6 +754,8 @@ interface ModulePublicRuntimeConfig {

navigation: ModuleOptions['navigation']

enableContentHead: ModuleOptions['enableContentHead']
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe contentHeadMeta or contentMetaTags, instead of enableContentHead. WDYT?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

still as a boolean?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes as a boolean, or maybe simpler contentHead

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Like documentDriven option, users can set it to false


documentDriven: ModuleOptions['documentDriven']
}

Expand Down
7 changes: 5 additions & 2 deletions src/runtime/components/ContentDoc.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
<script lang="ts">
import { PropType, defineComponent, h, useSlots } from 'vue'
import { withTrailingSlash } from 'ufo'
import { useRuntimeConfig } from '#app'
import type { QueryBuilderParams } from '../types'
import ContentRenderer from './ContentRenderer.vue'
import ContentQuery from './ContentQuery.vue'
Expand Down Expand Up @@ -74,6 +75,8 @@ export default defineComponent({
* @slot not-found
*/
render (ctx: any) {
const { enableContentHead } = useRuntimeConfig().public.content

const slots = useSlots()

const { tag, excerpt, path, query, head } = ctx
Expand All @@ -94,12 +97,12 @@ export default defineComponent({
// Default slot
default: slots?.default
? ({ data, refresh, isPartial }: any) => {
if (head) { useContentHead(data) }
if (head && enableContentHead) { useContentHead(data) }
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it is a better approach if we use enableContentHead as default value head props and let users overwrite it in special cases if they want to.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't understand this comment. Could you explain we use enableContentHead as default value head props.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This component accepts a head props with true as default, we can set the default to undefined then assing enableContentHead to it if it's undefined

maybe this snippet describes it better

const shouldInjectContentHead = props.head === undefined ? enableContentHead : props.head

if (shouldInjectContentHead) { useContentHead(data) }

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Okkk, I understand. Will update the PR.


return slots.default?.({ doc: data, refresh, isPartial, excerpt, ...this.$attrs })
}
: ({ data }: any) => {
if (head) { useContentHead(data) }
if (head && enableContentHead) { useContentHead(data) }

return h(
ContentRenderer,
Expand Down
6 changes: 5 additions & 1 deletion src/runtime/pages/document-driven.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
<script setup lang="ts">
import { useRuntimeConfig } from '#app'
import { useContent, useContentHead, useRequestEvent } from '#imports'

const { enableContentHead } = useRuntimeConfig().public.content
const { page, layout } = useContent()

// Page not found, set correct status code on SSR
Expand All @@ -9,7 +11,9 @@ if (!(page as any).value && process.server) {
event.res.statusCode = 404
}

useContentHead(page)
if (enableContentHead) {
useContentHead(page)
}
</script>

<template>
Expand Down