Add shell script for icon generation boilerplate

[mym0404]

I wrote a shell script to generate boilerplate for util/Icons.ts
I forked this project but cannot find how can I add this feature.

Can you suggest any idea for adding a feature to this repository?

repository

Result

generates

import BACK from '../../assets/icons/back.png';
import CLOSE from '../../assets/icons/close.png';
import MASK from '../../assets/icons/mask.png';
import MyName from '../../assets/icons/myName.svg';

export const IC_BACK = BACK;
export const IC_CLOSE = CLOSE;
export const IC_MASK = MASK;

export const SVGMyName = MyName;

I think this is a useful feature for boilerplate

Usage

package.json

"icon": "sh ./script/image_generate.sh ./assets/icons ./src/utils/Icons.ts",

script/icon_constant.sh

# arguments parse
ASSET_DIRECTORY=$1
ICON_FILE=$2

EXCLUDE_REGEX="@3x|@2x"

ICON_FILECOUNT=0
SVG_FILECOUNT=0

# general asset
declare -a ICON_KEY_ARRAY
declare -a ICON_CONST_ARRAY
declare -a ICON_PATH_ARRAY

# svg asset
declare -a SVG_KEY_ARRAY
declare -a SVG_CONST_ARRAY
declare -a SVG_PATH_ARRAY

for image in "$ASSET_DIRECTORY"/*
do
  # filter multiplied images
  if [[ $image =~ $EXCLUDE_REGEX ]] ; then
    continue
  fi

  # filter directory or empty file
  if [[ -d "$image" ]] || ! [[ -s "$image" ]]  ; then
    continue;
  fi

  # parse image name
  assetExtension="${image##*.}" # extension
  assetNameWithExtension="${image##*/}" # filename + extension without path (after last '/' in path)
  assetName="${assetNameWithExtension%.*}" # filename without extension

  # capitlize assetName if svg file or uppercase
  if [[ $assetExtension =~ "svg" ]] ; then
    capitlizedAssetName="$(tr '[:lower:]' '[:upper:]' <<< ${assetName:0:1})${assetName:1}"

    variableName="SVG${capitlizedAssetName}"

    SVG_KEY_ARRAY[$SVG_FILECOUNT]=$capitlizedAssetName
    SVG_CONST_ARRAY[$SVG_FILECOUNT]=$variableName
    SVG_PATH_ARRAY[$SVG_FILECOUNT]=$(realpath --relative-to="$(dirname $ICON_FILE)" $image)

    SVG_FILECOUNT=$(expr $SVG_FILECOUNT + 1)
  else
    upperCasedAssetName=$(echo "$assetName" | tr "[:lower:]" "[:upper:]")

    variableName="IC_${upperCasedAssetName}"

    ICON_KEY_ARRAY[$ICON_FILECOUNT]=$upperCasedAssetName
    ICON_CONST_ARRAY[$ICON_FILECOUNT]=$variableName
    ICON_PATH_ARRAY[$ICON_FILECOUNT]=$(realpath --relative-to="$(dirname $ICON_FILE)" $image)

    ICON_FILECOUNT=$(expr $ICON_FILECOUNT + 1)
  fi


done

rm temp_image
touch temp_image

for ((i=0; i<ICON_FILECOUNT; i++)); do
  echo "import ${ICON_KEY_ARRAY[i]} from '${ICON_PATH_ARRAY[i]}';" >> temp_image
done

for ((i=0; i<SVG_FILECOUNT; i++)); do
  echo "import ${SVG_KEY_ARRAY[i]} from '${SVG_PATH_ARRAY[i]}';" >> temp_image
done

echo "" >> temp_image

for ((i=0; i<ICON_FILECOUNT; i++)); do
  echo "export const ${ICON_CONST_ARRAY[i]} = ${ICON_KEY_ARRAY[i]};" >> temp_image
done

echo "" >> temp_image

for ((i=0; i<SVG_FILECOUNT; i++)); do
  echo "export const ${SVG_CONST_ARRAY[i]} = ${SVG_KEY_ARRAY[i]};" >> temp_image
done

cp temp_image $ICON_FILE

rm -rf temp_image

[hyochan]

@mym0404 I love your idea and indeed, this has been what we've been thinking of previously for long time which is great 💯. We are heading to seamless translation these days and we actually didn't drive this feature yet because we wanted to know the actual effect on fbt before driving forward. If we find something useful inside there, maybe we can jump there instead of our current shelter.
Would you mind having some research on using FBT and share it in our community?

[mym0404]

@hyochan Sure 😄 I feel cool because of new insight about fbt like.

[hyochan]

Today, we managed to use fbt in our project and found that this has nothing to do with assets. Can we drive this issue forward @mym0404? Are you using this shell script in your project either?

[mym0404]

Today, we managed to use fbt in our project and found that this has nothing to do with assets. Can we drive this issue forward @mym0404? Are you using this shell script in your project either?

I will check it :) I am using my script in my project now