make-component

#!/bin/bash
set -e

# if the user inputted a positional arg, use that as the component dash name.
# otherwise, prompt.
if [ -n "$1" ]; then
  COMPONENTDASH="$1"
  echo "Cool, we're making a $COMPONENTDASH component."
else
  echo "Let's make a new component."
  printf "Enter the name of your component, in dash-case: "; read COMPONENTDASH
fi

COMPONENTUPPERCAMEL="$(echo "$COMPONENTDASH" | perl -pe 's/(^|-)./uc($&)/ge;s/_//g' | sed 's/-//g')"

first="$(echo $COMPONENTUPPERCAMEL | cut -c1 | tr [A-Z] [a-z])"
second="$(echo $COMPONENTUPPERCAMEL | cut -c2-)"
COMPONENTCAMEL="$first$second"

echo "* Copying template to src/components/$COMPONENTDASH..."
cp -R .component-template src/components/$COMPONENTDASH

echo "* Replacing placeholders with variations of $COMPONENTDASH..."
for f in $(ls src/components/$COMPONENTDASH); do
  sed \
    -i .bkp \
    -e "s/%COMPONENTDASH%/$COMPONENTDASH/g" \
    -e "s/%COMPONENTCAMEL%/$COMPONENTCAMEL/g" \
    -e "s/%COMPONENTUPPERCAMEL%/$COMPONENTUPPERCAMEL/g" \
    src/components/$COMPONENTDASH/$f
  rm -f src/components/$COMPONENTDASH/$f.bkp
done

echo "You have a new component in src/components/$COMPONENTDASH:"
echo "* src/components/$COMPONENTDASH/index.js contains your component code."
echo "* src/components/$COMPONENTDASH/_styles.scss contains your component styles."

echo "* Press enter to open the documentation in your \$EDITOR..."
read

EDITOR="${EDITOR:-vi}"
$EDITOR src/components/$COMPONENTDASH/README.md