feat(@dpc-sdp/nuxt-ripple-cli): add rplVersion, adding support for co…

…ntent type names with numbers
dpc-sdp · Jul 10, 2023 · 8592b86 · 8592b86
1 parent 7ca7ad9
commit 8592b86
Show file tree

Hide file tree

Showing 12 changed files with 42 additions and 29 deletions.
diff --git a/packages/nuxt-ripple-cli/README.md b/packages/nuxt-ripple-cli/README.md
@@ -58,13 +58,15 @@ nuxt-ripple add component [DIRECTORY] --name {NAME} --prefix {PREFIX}
 #### Add Content Type
 
 ```bash
-nuxt-ripple add content-type [DIRECTORY] --name {NAME} --createTests --cypressPath {CYPRESSPATH}
+nuxt-ripple add content-type [DIRECTORY] --name {NAME} --rplVersion {RPL_VERSION} --createTests --cypressPath {CYPRESSPATH}
 ```
 
 `[DIRECTORY]`: The directory to output the content type scaffolding.
 
 `--name {NAME}`: The name of the project or layer.
 
+`--rplVersion {RPL_VERSION}`: The version of the ripple core dependencies to use.
+
 `--createTests` or `-T`: A flag to opt into example tests.
 
 `--cypressPath {CYPRESSPATH}`: The path to the Cypress support folder, this is used when opting into the example tests.

diff --git a/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/body-component.vue.t b/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/body-component.vue.t
@@ -1,5 +1,5 @@
 ---
-to: components/Tide<%= h.changeCase.pascalCase(name) %>Body.vue
+to: components/Tide<%= h.pascalCaseMerge(name) %>Body.vue
 ---
 <template>
   <RplPageComponent class="tide-<%= h.changeCase.paramCase(name) %>">

diff --git a/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/fixture.json.ts.t b/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/fixture.json.ts.t
@@ -6,7 +6,7 @@ to: "<%= locals.createTests ? `${cypressPath}/fixtures/${h.changeCase.kebabCase(
   "title": "Sample <%= name %>",
   "changed": "2022-11-16T16:39:04+11:00",
   "created": "2022-10-10T12:44:43+11:00",
-  "type": "<%= h.changeCase.pascalCase(name) %>",
+  "type": "<%= h.changeCase.snakeCase(name) %>",
   "nid": "00000000-0000-0000-0000-000000000000",
   "header": {
     "title": "Sample <%= name %>",

diff --git a/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/header-component.vue.t b/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/header-component.vue.t
@@ -1,5 +1,5 @@
 ---
-to: components/Tide<%= h.changeCase.pascalCase(name) %>Header.vue
+to: components/Tide<%= h.pascalCaseMerge(name) %>Header.vue
 ---
 <template>
   <RplHeroHeader
@@ -12,10 +12,10 @@ to: components/Tide<%= h.changeCase.pascalCase(name) %>Header.vue
 </template>
 
 <script setup lang="ts">
-import type { Tide<%= h.changeCase.pascalCase(name) %>Header } from '../types'
+import type { Tide<%= h.pascalCaseMerge(name) %>Header } from '../types'
 
 interface Props {
-  header: Tide<%= h.changeCase.pascalCase(name) %>Header
+  header: Tide<%= h.pascalCaseMerge(name) %>Header
   hasBreadcrumbs: boolean
 }
 

diff --git a/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/mapping.ts.t b/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/mapping.ts.t
@@ -12,7 +12,7 @@ import {
   tidePageBaseIncludes
 } from '@dpc-sdp/nuxt-ripple/mapping'
 
-const tide<%= h.changeCase.pascalCase(name) %>Module: IRplTideModuleMapping = {
+const tide<%= h.pascalCaseMerge(name) %>Module: IRplTideModuleMapping = {
   mapping: {
     ...tidePageBaseMapping(),
     // TODO: the below mapping is an example only, add your mapping here
@@ -36,4 +36,4 @@ const tide<%= h.changeCase.pascalCase(name) %>Module: IRplTideModuleMapping = {
   ]
 }
 
-export default tide<%= h.changeCase.pascalCase(name) %>Module
+export default tide<%= h.pascalCaseMerge(name) %>Module
diff --git a/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/package.json.t b/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/package.json.t
@@ -11,10 +11,10 @@ to: package.json
     "./mapping": "./mapping/index.ts",
     "./types": "./types.ts"
   },
-  "version": "2.1.0-alpha.188",
+  "version": "1.0.0",
   "dependencies": {
-    "@dpc-sdp/nuxt-ripple": "2.1.0-alpha.188",
-    "@dpc-sdp/ripple-tide-api": "2.1.0-alpha.186",
-    "@dpc-sdp/ripple-ui-core": "2.1.0-alpha.186"
+    "@dpc-sdp/nuxt-ripple": "<%= rplVersion %>",
+    "@dpc-sdp/ripple-tide-api": "<%= rplVersion %>",
+    "@dpc-sdp/ripple-ui-core": "<%= rplVersion %>"
   }
 }
diff --git a/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/page-component.vue.t b/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/page-component.vue.t
@@ -1,5 +1,5 @@
 ---
-to: components/global/Tide<%= h.changeCase.pascalCase(name) %>.vue
+to: components/global/Tide<%= h.pascalCaseMerge(name) %>.vue
 ---
 <template>
   <TideBaseLayout
@@ -20,13 +20,13 @@ to: components/global/Tide<%= h.changeCase.pascalCase(name) %>.vue
       <slot name="breadcrumbs" />
     </template>
     <template #aboveBody="{ hasBreadcrumbs }">
-      <Tide<%= h.changeCase.pascalCase(name) %>Header
+      <Tide<%= h.pascalCaseMerge(name) %>Header
         :header="page.header"
         :hasBreadcrumbs="hasBreadcrumbs"
       />
     </template>
     <template #body="{ hasSidebar }">
-      <Tide<%= h.changeCase.pascalCase(name) %>Body :bodyContent="page.body.content" />
+      <Tide<%= h.pascalCaseMerge(name) %>Body :bodyContent="page.body.content" />
     </template>
     <template #sidebar>
       <slot name="sidebar" />
@@ -39,11 +39,11 @@ to: components/global/Tide<%= h.changeCase.pascalCase(name) %>.vue
 
 <script setup lang="ts">
 import { TideSiteData } from '@dpc-sdp/ripple-tide-api/types'
-import type { Tide<%= h.changeCase.pascalCase(name) %>Page } from '../../types'
+import type { Tide<%= h.pascalCaseMerge(name) %>Page } from '../../types'
 
 interface Props {
   site: TideSiteData
-  page: Tide<%= h.changeCase.pascalCase(name) %>Page
+  page: Tide<%= h.pascalCaseMerge(name) %>Page
 }
 
 defineProps<Props>()

diff --git a/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/server-plugin.ts.t b/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/server-plugin.ts.t
@@ -2,9 +2,9 @@
 to: server/plugins/<%= h.changeCase.paramCase(name) %>.ts
 ---
 import { defineNitroPlugin } from 'nitropack/dist/runtime/plugin'
-import <%= h.changeCase.pascalCase(name) %>Mapping from './../../mapping'
+import <%= h.pascalCaseMerge(name) %>Mapping from './../../mapping'
 import type { NitroApp } from 'nitropack'
 
 export default defineNitroPlugin(async (nitroApp: NitroApp) => {
-  nitroApp.tide?.pageApi.setContentType('<%= h.changeCase.paramCase(name) %>', <%= h.changeCase.pascalCase(name) %>Mapping)
+  nitroApp.tide?.pageApi.setContentType('<%= h.changeCase.snakeCase(name) %>', <%= h.pascalCaseMerge(name) %>Mapping)
 })
diff --git a/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/test.feature.t b/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/test.feature.t
@@ -11,4 +11,4 @@ Feature: <%= name %> page
 
   @mockserver
   Scenario: On load
-    Then the title should be "Sample <%= h.changeCase.pascalCase(name) %>"
+    Then the title should be "Sample <%= name %>"
diff --git a/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/types.ts.t b/packages/nuxt-ripple-cli/src/commands/add/_templates/add/content-type/types.ts.t
@@ -4,24 +4,24 @@ to: types.ts
 
 import type { TidePageBase, TideImageField } from '@dpc-sdp/ripple-tide-api/types'
 
-export type Tide<%= h.changeCase.pascalCase(name) %>Header = {
+export type Tide<%= h.pascalCaseMerge(name) %>Header = {
   title: string
   summary: string
 }
 
-export type Tide<%= h.changeCase.pascalCase(name) %>Body = {
+export type Tide<%= h.pascalCaseMerge(name) %>Body = {
   image: TideImageField
   caption: string
   content: string
 }
 
-export interface Tide<%= h.changeCase.pascalCase(name) %>Page extends TidePageBase {
+export interface Tide<%= h.pascalCaseMerge(name) %>Page extends TidePageBase {
   /**
    * @description RplHeader component
    */
-  header: Tide<%= h.changeCase.pascalCase(name) %>Header
+  header: Tide<%= h.pascalCaseMerge(name) %>Header
   /**
    * @description Props for component wrapper
    */
-  body: Tide<%= h.changeCase.pascalCase(name) %>Body
+  body: Tide<%= h.pascalCaseMerge(name) %>Body
 }
diff --git a/packages/nuxt-ripple-cli/src/commands/add/helpers.ts b/packages/nuxt-ripple-cli/src/commands/add/helpers.ts
@@ -1,5 +1,8 @@
-import { paramCase, pascalCase } from 'change-case'
+import { paramCase, pascalCase, pascalCaseTransformMerge } from 'change-case'
 export default {
+  pascalCaseMerge: function (name) {
+    return pascalCase(name, { transform: pascalCaseTransformMerge })
+  },
   prefixedPascalCase: function (prefix, name) {
     return `${pascalCase(prefix)}${pascalCase(name)}`
   },

diff --git a/packages/nuxt-ripple-cli/src/commands/add/index.ts b/packages/nuxt-ripple-cli/src/commands/add/index.ts
@@ -12,7 +12,7 @@ export default function rplAddCommand() {
       `project directory, default is ${process.cwd() + '/components'}`,
       process.cwd() + '/components'
     )
-    .option(
+    .requiredOption(
       '--name [name]',
       'The components name eg: modal. Note: a prefix will be added separately with the --prefix option'
     )
@@ -28,8 +28,16 @@ export default function rplAddCommand() {
   rplAddCommand
     .command('content-type')
     .description('Scaffold a Ripple tide content type')
-    .argument('[directory]', 'The project directory, this defaults to the current working directory (CWD)', process.cwd())
-    .option('--name [name]', 'The name of content type')
+    .argument(
+      '[directory]',
+      'The project directory, this defaults to the current working directory (CWD)',
+      process.cwd()
+    )
+    .requiredOption('--name [name]', 'The name of content type')
+    .requiredOption(
+      '--rplVersion [rplVersion]',
+      'The ripple version to use: eg: 2.0.0'
+    )
     .option('-T --createTests', 'This will create Cypress test script examples')
     .option(
       '--cypressPath [cypressPath]',