Adds a React Function Component in the supplied directory.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#!/bin/zsh | |
# | |
# React Function Component Maker made with ❤ by Lucas G. Terracino | |
# | |
# Help | |
show_help() { | |
# Display help | |
echo "Usage: pls_react_function_component [OPTION]... COMPONENT..." | |
echo "Adds a React Function Component in the supplied directory." | |
echo "" | |
echo "If subfolder doesn't exist it won't be created unless -p is provided." | |
echo "Optional parameters" | |
echo " -e Changes the extension of the created files to the one provided." | |
echo " In case of choosing ts, semicolons are removed from files." | |
echo " Default value is js." | |
echo " -p Creates parent folders if they don't exist." | |
echo " -h Shows this message" | |
echo "" | |
} | |
# Main Script | |
pls_react_function_component() { | |
extension="js" | |
semicolon=";" | |
create_parents="false" | |
OPTIND=1 # Reset in case getopts has been used previously in the shell. | |
# Parsing options | |
while getopts "h?p?e:" OPTION; do | |
case "${OPTION}" in | |
h|\?) | |
show_help | |
return | |
;; | |
p) | |
create_parents="true" | |
;; | |
e) | |
extension=${OPTARG} | |
if [ $extension = "ts" ]; then | |
semicolon="" | |
fi | |
;; | |
: ) | |
echo "Invalid option: $OPTARG requires an argument" 1>&2 | |
;; | |
esac | |
done | |
# Shifting variable $1 from options to params | |
shift $((OPTIND-1)) | |
[ "${1:-}" = "--" ] && shift | |
# Exit if no arguments! | |
if [ $# -eq 0 ]; then | |
echo "👎 No arguments supplied" | |
return 0 | |
fi | |
# If the final directory doesn't exist function continues | |
if [ -d $1 ]; then | |
echo "👎 Directory already exists, I won't overwrite it" | |
return 0 | |
fi | |
# Getting the path and name | |
component_path="$@" | |
component_name="`basename $component_path`" | |
# Preparing the data for the files | |
index_data="export { default } from \"./$component_name\"$semicolon" | |
component_data="import React from 'react'$semicolon | |
function $component_name() { | |
return ( | |
<React.Fragment></React.Fragment> | |
)$semicolon | |
} | |
export default $component_name$semicolon" # End of component_data | |
# Checking if directory exists | |
if [ ! -d $component_path ]; then | |
# Creating the Directory | |
if [ "$create_parents" = "true" ]; then | |
mkdir --parents "${component_path}" | |
else | |
mkdir "${component_path}" | |
fi | |
# Creating files with the data arranged previously | |
if [ -d $component_path ]; then | |
[ ! -f /etc/resolv.conf ] && echo $component_data > "$component_path/$component_name.$extension" | |
[ ! -f /etc/resolv.conf ] && echo $index_data > "$component_path/index.$extension" | |
echo "⚛️ Function component $component_name created!" | |
else | |
# Errors creating the folders | |
echo " └ cannot create the folder." | |
if [ "$create_parents" = "false" ]; then | |
echo " Use -p To also create parents folders." | |
fi | |
return 0 | |
fi | |
return 0 | |
fi | |
} | |
pls_react_function_component $* |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment