summaryrefslogtreecommitdiffstats
path: root/scripts/generate-component.bash
blob: 96cdcee721b6585ae79cb21b1d8b65bcc9be3b70 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
#!/bin/bash

# bash script to generate a component. you are free to create components
# manually. the purpose of this script is to keep things consistent.

# and yeah, I know I could write it in JavaScript. but I just felt like writing
# in Bash.

# the first parameter passed to this script will be considered as the component
# name. please provide the name in snake-case. for example: root-layout

CSS_MODULE_NAME="$(echo $1 | sed -r 's/\ /-/g')".module.css
COMPONENT_DIR_NAME=$(echo $1 | sed -r 's/(^|-|_|\ )([a-z])/\U\2/g')

# gen_boilerplate_code() -> string
# generates boilerplate code for the component.
# @param {string} 1 - name of the component
# @param {string} 2 - path of the css module file

function gen_boilerplate_code() {
  CODE="import React from 'react';
import classes from '$2';

type PropType = {};

export function $1(props: PropType) {
  return <>$1 Works!!</>;
}"

  echo -e "$CODE"
}

################
##   START    ##
################
echo -e "
    +++++++++++++++++++++++++++++++
    ++                           ++
    ++    COMPONENT GENERATOR    ++
    ++    v0.1                   ++
    ++                           ++
    +++++++++++++++++++++++++++++++
"

# create components dir if it does not exists
if [ ! -d ./components ]; then
  mkdir -p ./components
fi

if [ -d ./components/$COMPONENT_DIR_NAME ]; then
  echo "==> Component '$COMPONENT_DIR_NAME' exists!"
  exit 1
else
  echo "==> Creating ./components/$COMPONENT_DIR_NAME ..."
  mkdir -p ./components/$COMPONENT_DIR_NAME/

  echo "==> Creating ./components/$COMPONENT_DIR_NAME/index.tsx ..."
  touch ./components/$COMPONENT_DIR_NAME/index.tsx

  echo "==> Creating ./components/$COMPONENT_DIR_NAME/$CSS_MODULE_NAME ..."
  touch ./components/$COMPONENT_DIR_NAME/$CSS_MODULE_NAME

  echo "==> Generating boilerplate code ..."
  gen_boilerplate_code $COMPONENT_DIR_NAME ./$CSS_MODULE_NAME \
  >./components/$COMPONENT_DIR_NAME/index.tsx

  echo "==> DONE!!"
fi