feat: add style to generated assets and update meta file template

ipetinate · May 23, 2024 · e7df1d2 · e7df1d2
1 parent 6049a77
commit e7df1d2
Show file tree

Hide file tree

Showing 5 changed files with 62 additions and 16 deletions.
diff --git a/.clingon/templates/meta.yaml b/.clingon/templates/meta.yaml
@@ -10,6 +10,9 @@
   story:
     path: 'src/components'
     template: './ReactComponent/Component.stories.tsx'
+  style:
+    path: 'src/components'
+    template: './ReactComponent/Component.styles.css'
 
 - identifier: async-function
   case: 'kebab-case'

diff --git a/src/generators/scaffold-template.js b/src/generators/scaffold-template.js
@@ -47,40 +47,53 @@ function checkPaths(name, template) {
     const targets = {
       resource: false,
       test: false,
-      story: false
+      story: false,
+      style: false
     }
 
     const resourcePath = template?.folderWrapper
       ? join(template?.resource?.path, name)
       : template?.resource?.path
 
-    const storyPath = template?.folderWrapper
-      ? join(template?.story?.path, name)
-      : template?.story?.path
-
-    const testPath = template?.folderWrapper
-      ? join(template?.test?.path, name)
-      : template?.test?.path
-
     targets.resource = checkDirectoriesTree(splitPathString(resourcePath))
 
     if (!targets?.resource) {
       targets.resource = createDir(getTargetFullPath(resourcePath))
     }
 
     if (template?.test) {
+      const testPath = template?.folderWrapper
+        ? join(template?.test?.path, name)
+        : template?.test?.path
+
       targets.test = checkDirectoriesTree(splitPathString(testPath))
 
       if (!targets.test) {
-        targets.resource = createDir(getTargetFullPath(testPath))
+        targets.test = createDir(getTargetFullPath(testPath))
       }
     }
 
     if (template?.story) {
+      const storyPath = template?.folderWrapper
+        ? join(template?.story?.path, name)
+        : template?.story?.path
+
       targets.story = checkDirectoriesTree(splitPathString(storyPath))
 
       if (!targets.story) {
-        targets.resource = createDir(getTargetFullPath(storyPath))
+        targets.story = createDir(getTargetFullPath(storyPath))
+      }
+    }
+
+    if (template?.style) {
+      const stylePath = template?.folderWrapper
+        ? join(template?.style?.path, name)
+        : template?.style?.path
+
+      targets.style = checkDirectoriesTree(splitPathString(stylePath))
+
+      if (!targets.style) {
+        targets.style = createDir(getTargetFullPath(stylePath))
       }
     }
 
@@ -168,6 +181,15 @@ function handleTemplateReplacements({
         template
       )
     }
+
+    if (templatesContent?.style) {
+      templatesContent.style = replaceContentFromSideResource(
+        name,
+        templatesContent.style,
+        'style',
+        template
+      )
+    }
   }
 
   return { name, template, templatesContent, targets }
@@ -208,6 +230,19 @@ function createResources({ name, targets, template, templatesContent }) {
     if (testCreated) created.push(fullPath)
   }
 
+  if (targets?.style) {
+    if (template.folderWrapper)
+      template.style.path = join(template?.style?.path, name)
+
+    const fullPath = getFullPath(name, 'style', template)
+    const styleCreated = createFileWithContent(
+      fullPath,
+      templatesContent?.style
+    )
+
+    if (styleCreated) created.push(fullPath)
+  }
+
   if (targets?.story) {
     if (template.folderWrapper)
       template.story.path = join(template?.story?.path, name)

diff --git a/src/schemas/custom-template.js b/src/schemas/custom-template.js
@@ -15,6 +15,5 @@ export const templateResourceTypeMap = {
  */
 export const customTemplateTypeMap = {
   identifier: 'string',
-  case: 'string',
   resource: templateResourceTypeMap
 }
diff --git a/src/templates/core/meta.yaml b/src/templates/core/meta.yaml
@@ -1,8 +1,14 @@
-# Auto generated by Clingon CLI
-# This file is only a example, feel free to edit them
+# ┌-----------------------------------------------------------------┐
+# ⎪                 Auto generated by Clingon CLI                   ⎪
+# ⎪      This file is only a example, feel free to edit them        ⎪
+# ⎪                                                                 ⎪
+# ⎪ In the README file you will find more details and a complete    ⎪
+# ⎪ guide on how to use this feature: .clingon/templates/README.md  ⎪
+# ⎪                 -------------------------------                 ⎪
+# ⎪                 AFTER READ, REMOVE THIS SECTION                 ⎪
+# └-----------------------------------------------------------------┘
 
-# In the README file you will find more details and a complete guide on how to use this feature:
-# .clingon/templates/README.md
+# Component
 
 - identifier: component
   folderWrapper: true
@@ -19,6 +25,8 @@
     path: 'src/components'
     template: './component/Component.styles.css'
 
+# Async Function
+
 - identifier: async-function
   resource:
     path: src/utils

diff --git a/src/types.js b/src/types.js
@@ -106,6 +106,7 @@ import {
  *  resource: TemplateResource
  *  test?: TemplateResource
  *  story?: TemplateResource
+ *  style?: TemplateResource
  * }} CustomTemplate - Custom template from meta file
  *
  * @typedef {"bigint" | "boolean" | "function" | "number" | "object" | "string" | "symbol" | "undefined"} Primitives - JS Primities