startupjs 0.40.12 → 0.41.0

package/dev

@@ -0,0 +1,127 @@
+#!/bin/sh
+# shellcheck disable=SC2059
+
+# Exit on first failed command
+set -e
+
+# Run startupjs project using only Docker
+#
+# Version: 0.1.0
+#
+# Suports Mac, Linux, Windows WSL2
+#
+# Usage:
+#   ./dev - universal command to run the main terminal or spawn additional terminals.
+#           It tries to do the following:
+#           1. Run the dev docker image of the same version of startupjs as in package.json.
+#           2. If dev image is already running -- exec into it.
+
+# Use current folder name as the name for container and the image by default
+# ref: https://stackoverflow.com/a/43919044
+a="/$0"; a=${a%/*}; a=${a#/}; a=${a:-.}; SCRIPT_DIR=$(cd "$a"; pwd)
+FOLDER_NAME=$( basename "$SCRIPT_DIR" )
+
+IMAGE_NAME="startupjs/dev"
+CONTAINER_NAME="$FOLDER_NAME"
+
+# Get startupjs version from package.json
+STARTUPJS_VERSION=$( [ -f ./package.json ] && (grep -m 1 '"startupjs"' < ./package.json | sed -n 's/^[^"]*"[^"]*"[^"]*"//p' | sed -n 's/"[^"]*$//p') || echo '' )
+STARTUPJS_VERSION=${STARTUPJS_VERSION:-latest}
+# Remove leading ^ or ~ and remove the last patch number.
+# This way ^0.40.2 will be converted to 0.40
+# TODO: if yarn.lock exists, get the exact patch version from there
+STARTUPJS_VERSION=$( echo "$STARTUPJS_VERSION" | sed -n 's/^[\^\~]*//p' | sed -n 's/\.*[0-9]*$//p' )
+
+# Helper constants
+ROOT="${PWD}"
+# folder to store the MongoDB data
+DB_FOLDER="${ROOT}/.mongo"
+OS_NAME=$( uname -s | tr A-Z a-z )
+# on Mac OS we use a faster driver for volume mounts
+VOLUME_MODE=$( [ "$OS_NAME" = "darwin" ] && echo ":delegated" || echo "" )
+
+# Colors
+COLOR_NONE='\033[0m'
+COLOR_LIGHT_GREEN='\033[1;32m'
+COLOR_LIGHT_RED='\033[1;31m'
+
+main () {
+  if docker ps | grep "\s${CONTAINER_NAME}$"; then
+    printf "${COLOR_LIGHT_GREEN}EXEC into the running container '${CONTAINER_NAME}'...${COLOR_NONE}\n"
+    _exec
+  else
+    printf "${COLOR_LIGHT_GREEN}RUN a new dev container '${CONTAINER_NAME}'...${COLOR_NONE}\n"
+    _cleanup
+    _run
+  fi
+}
+
+_exec () {
+  printf "${COLOR_LIGHT_GREEN}You are now inside the dev environment. Run your commands here:${COLOR_NONE}\n"
+  docker exec -it \
+    -e "CONTAINER_NAME=${CONTAINER_NAME}" \
+    "${CONTAINER_NAME}" \
+    bash
+}
+
+_run () {
+  PORT="${PORT:-$( _find_open_PORT )}"
+  DEV_PORT="${DEV_PORT:-$( _find_open_DEV_PORT )}"
+  if [ "$PORT" != "3000" ]; then
+    printf "${COLOR_LIGHT_RED}IMPORTANT: Default port 3000 was occupied. Your app got assigned the port ${PORT}${COLOR_NONE}!\n"
+  fi
+  printf "${COLOR_LIGHT_GREEN}You are now inside the dev environment. Run your commands here:${COLOR_NONE}\n"
+  echo "CONTAINER_NAME: $CONTAINER_NAME"
+  echo "PORT: $PORT"
+  echo "DEV_PORT: $DEV_PORT"
+  echo "ROOT: $ROOT"
+  echo "VOLUME_MODE: $VOLUME_MODE"
+  echo "HOME: $HOME"
+  echo "DB_FOLDER: $DB_FOLDER"
+  echo "IMAGE_NAME: $IMAGE_NAME"
+  echo "STARTUPJS_VERSION: $STARTUPJS_VERSION"
+  docker run --rm -it \
+    --name "${CONTAINER_NAME}" \
+    --pull=always \
+    -e "CONTAINER_NAME=${CONTAINER_NAME}" \
+    -e "DOCKER_HOST_PORT=${PORT}" \
+    --ulimit nofile=65535:65535 \
+    -p "${PORT}:3000" \
+    -p "${DEV_PORT}:3010" \
+    -v "${ROOT}:/ws${VOLUME_MODE}" \
+    -v "${HOME}/.ssh:/root/.ssh" \
+    -v "${HOME}/.gitconfig:/root/.gitconfig" \
+    -v "${DB_FOLDER}:/data/db${VOLUME_MODE}" \
+    "${IMAGE_NAME}:${STARTUPJS_VERSION}"
+}
+
+# Keep only 5 latest startupjs images you pulled. Remove older ones
+# ref: https://stackoverflow.com/a/40892314
+_cleanup () {
+  # shellcheck disable=SC2046
+  docker rmi $(docker images -q ${IMAGE_NAME} | tail -n +6) || true
+}
+
+# a bit hardcody way to get available port for the app. Start with 3000 and go up to 3009
+_find_open_PORT () {
+  for iterator in 0 1 2 3 4 5 6 7 8 9; do
+    a_port="300${iterator}"
+    if ! lsof -n -i tcp:$a_port; then
+      echo $a_port
+      break
+    fi
+  done
+}
+
+# the same hardcody way as above to get available port for webpack devserver. Start with 3010 and go up to 3019
+_find_open_DEV_PORT () {
+  for iterator in 0 1 2 3 4 5 6 7 8 9; do
+    a_port="301${iterator}"
+    if ! lsof -n -i tcp:$a_port; then
+      echo $a_port
+      break
+    fi
+  done
+}
+
+main "$@"; exit

package/index.d.ts

@@ -4,5 +4,6 @@ export * from '@startupjs/hooks'
 //        on the server and on the client
 export * from '@startupjs/isomorphic-helpers'
 // dummy babel macro functions for @startupjs/babel-plugin-rn-stylename-inline
-export function css (): void
-export function styl (): void
+export function css (css: TemplateStringsArray): any
+export function styl (styl: TemplateStringsArray): any
+export function pug (pug: TemplateStringsArray): any

package/index.js

@@ -4,6 +4,8 @@ export * from '@startupjs/hooks'
 //        on the server and on the client
 export * from '@startupjs/isomorphic-helpers'
 // dummy babel macro functions for @startupjs/babel-plugin-rn-stylename-inline
-export function css () {}
-export function styl () {}
+export function css (cssString) { return cssString }
+export function styl (stylString) { return stylString }
+// dummy pug function (it gets compiled to jsx by babel pug plugin)
+export function pug (pugString) { return pugString }
 export { default as t } from '@startupjs/i18n/client/t.js'

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "startupjs",
   "type": "module",
-  "version": "0.40.12",
+  "version": "0.41.0",
   "engines": {
     "node": ">= 14"
   },
@@ -10,20 +10,20 @@
   "bin": "./cli.js",
   "license": "MIT",
   "dependencies": {
-    "@startupjs/app": "^0.40.9",
-    "@startupjs/backend": "^0.40.6",
-    "@startupjs/bundler": "^0.40.9",
-    "@startupjs/cli": "^0.40.6",
-    "@startupjs/hooks": "^0.40.2",
-    "@startupjs/i18n": "^0.40.0",
-    "@startupjs/init": "^0.40.2",
-    "@startupjs/isomorphic-helpers": "^0.40.0",
-    "@startupjs/orm": "^0.40.0",
-    "@startupjs/patches": "^0.40.0",
-    "@startupjs/react-sharedb": "^0.40.2",
-    "@startupjs/server": "^0.40.6",
-    "babel-preset-startupjs": "^0.40.9",
+    "@startupjs/app": "^0.41.0",
+    "@startupjs/backend": "^0.41.0",
+    "@startupjs/bundler": "^0.41.0",
+    "@startupjs/cli": "^0.41.0",
+    "@startupjs/hooks": "^0.41.0",
+    "@startupjs/i18n": "^0.41.0",
+    "@startupjs/init": "^0.41.0",
+    "@startupjs/isomorphic-helpers": "^0.41.0",
+    "@startupjs/orm": "^0.41.0",
+    "@startupjs/patches": "^0.41.0",
+    "@startupjs/react-sharedb": "^0.41.0",
+    "@startupjs/server": "^0.41.0",
+    "babel-preset-startupjs": "^0.41.0",
     "react-native-web": "^0.14.3"
   },
-  "gitHead": "61873f78477d54cad8c05b3f6f59cf8792bb46c0"
+  "gitHead": "3f2d1582418ddbb989fd48de6dbc2c6847f36f26"
 }

package/templates/routing/Root/index.jsx

@@ -2,7 +2,7 @@ import React from 'react'
 import { Platform } from 'react-native'
 import init from 'startupjs/init'
 import App from 'startupjs/app'
-import { observer, model } from 'startupjs'
+import { pug, observer, model } from 'startupjs'
 import { BASE_URL } from '@env'
 import orm from '../model'
 

package/templates/routing/main/Layout/index.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { View, TouchableOpacity, Text } from 'react-native'
-import { observer, emit } from 'startupjs'
+import { pug, observer, emit } from 'startupjs'
 import './index.styl'
 
 export default observer(function ({ children }) {

package/templates/routing/main/pages/PAbout/index.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { Text, ScrollView } from 'react-native'
-import { observer } from 'startupjs'
+import { pug, observer } from 'startupjs'
 import './index.styl'
 
 export default observer(function PAbout () {

package/templates/routing/main/pages/PHome/index.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { ScrollView } from 'react-native'
-import { observer } from 'startupjs'
+import { pug, observer } from 'startupjs'
 import { TestComponent } from 'components'
 import './index.styl'
 

package/templates/simple/.eslintrc.json

@@ -15,7 +15,7 @@
     "Atomics": "readonly",
     "SharedArrayBuffer": "readonly"
   },
-  "parser": "babel-eslint",
+  "parser": "@babel/eslint-parser",
   "parserOptions": {
     "ecmaFeatures": {
       "legacyDecorators": true,

package/templates/simple/Dockerfile

@@ -15,7 +15,7 @@ RUN \
   # optionally use a custom npm token (if defined above)
   echo "//registry.npmjs.org/:_authToken=${NPM_TOKEN}" > ~/.npmrc && \
   # install build tools
-  apk add --no-cache make gcc g++ python git && \
+  apk add --no-cache make gcc g++ python3 git && \
   # ffmpeg is required at runtime for video & audio conversion libraries
   apk add --no-cache ffmpeg && \
   # install dependencies
@@ -25,7 +25,7 @@ RUN \
   # cleanup yarn
   yarn cache clean && \
   # cleanup build tools
-  apk del make gcc g++ python git
+  apk del make gcc g++ python3 git
 
 CMD yarn start-production
 

package/templates/simple/Root/index.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { Platform } from 'react-native'
-import { observer, model } from 'startupjs'
+import { pug, observer, model } from 'startupjs'
 import init from 'startupjs/init'
 import { BASE_URL } from '@env'
 import { TestComponent } from 'components'

package/templates/simple/components/TestComponent/index.jsx

@@ -5,6 +5,7 @@ import {
   TouchableOpacity
 } from 'react-native'
 import {
+  pug,
   observer,
   useDoc,
   useApi

package/templates/simple/dev

@@ -0,0 +1,50 @@
+#!/bin/sh
+# shellcheck disable=SC2059
+
+# Run startupjs project using only Docker
+#
+# Version: 0.1.0
+#
+# Suports Mac, Linux, Windows WSL2
+#
+# Usage:
+#   ./dev - universal command to run the main terminal or spawn additional terminals.
+#           It tries to do the following:
+#           1. Run the dev docker image of the same version of startupjs as in package.json.
+#           2. If dev image is already running -- exec into it.
+#
+# Note:
+#   This is a self-updating script, it will run the version of itself according to
+#   the startupjs version you have in your package.json
+
+# Exit on first failed command
+set -e
+
+TMP_FILE=/tmp/startupjs.dev.sh
+
+if [ -f ./node_modules/startupjs/dev ]; then
+  # if node_modules are already installed, run dev script from there
+  # TODO: Check if the startupjs version in node_modules matches the one in package.json, otherwise download script.
+  # shellcheck disable=SC1091
+  . ./node_modules/startupjs/dev
+else
+  # otherwise try to download the according version (from package.json) from github and run it dynamically
+  if which curl; then
+    mkdir -p node_modules
+    STARTUPJS_VERSION=$( [ -f ./package.json ] && (grep -m 1 '"startupjs"' < ./package.json | sed -n 's/^[^"]*"[^"]*"[^"]*"//p' | sed -n 's/"[^"]*$//p') || echo 'latest' )
+    # Remove leading ^ or ~
+    STARTUPJS_VERSION=$( echo "$STARTUPJS_VERSION" | sed -n 's/^[\^\~]*//p' )
+    if [ "$STARTUPJS_VERSION" = "latest" ]; then
+      STARTUPJS_VERSION="master"
+    else
+      STARTUPJS_VERSION="v${STARTUPJS_VERSION}"
+    fi
+    printf "Downloading dev shell script from startupjs '${STARTUPJS_VERSION}' on github to ${TMP_FILE}\n"
+    curl -L "https://raw.githubusercontent.com/startupjs/startupjs/${STARTUPJS_VERSION}/packages/startupjs/dev" > $TMP_FILE
+    # shellcheck source=/dev/null
+    . $TMP_FILE
+  else
+    printf "ERROR! 'curl' not found. Please install it and run './dev' again\n"
+    exit 1
+  fi
+fi

package/templates/simple/tsconfig.json

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "allowJs": true,
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true,
+    "isolatedModules": true,
+    "jsx": "react",
+    "lib": ["es6"],
+    "moduleResolution": "node",
+    "noEmit": true,
+    "strict": false,
+    "target": "esnext"
+  },
+  "exclude": [
+    "node_modules",
+    "babel.config.js",
+    "metro.config.js",
+    "jest.config.js"
+  ]
+}

package/templates/ui/Root/index.jsx

@@ -2,7 +2,7 @@ import React from 'react'
 import { Platform } from 'react-native'
 import init from 'startupjs/init'
 import App from 'startupjs/app'
-import { observer, model } from 'startupjs'
+import { pug, observer, model } from 'startupjs'
 import { registerPlugins } from 'startupjs/plugin'
 import { uiAppPlugin } from '@startupjs/ui'
 import { BASE_URL } from '@env'

package/templates/ui/components/TestComponent/index.jsx

@@ -1,9 +1,5 @@
 import React, { useState, useEffect } from 'react'
-import {
-  observer,
-  useApi,
-  useDoc
-} from 'startupjs'
+import { pug, observer, useApi, useDoc } from 'startupjs'
 import { Br, Button, Card, Div, Row, Span } from '@startupjs/ui'
 import axios from 'axios'
 import { faPlus, faMinus } from '@fortawesome/free-solid-svg-icons'

package/templates/ui/main/Layout/index.jsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { observer, emit, useValue, useLocal } from 'startupjs'
+import { pug, observer, emit, useValue, useLocal } from 'startupjs'
 import { Button, Div, H1, Layout, Menu, Row, SmartSidebar } from '@startupjs/ui'
 import { faBars } from '@fortawesome/free-solid-svg-icons'
 import APP from '../../app.json'

package/templates/ui/main/pages/PAbout/index.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { Text, ScrollView } from 'react-native'
-import { observer } from 'startupjs'
+import { pug, observer } from 'startupjs'
 import { Content } from '@startupjs/ui'
 import './index.styl'
 

package/templates/ui/main/pages/PHome/index.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { ScrollView } from 'react-native'
-import { observer } from 'startupjs'
+import { pug, observer } from 'startupjs'
 import { Content } from '@startupjs/ui'
 import { TestComponent } from 'components'
 import './index.styl'

package/templates/simple/docker

@@ -1,30 +0,0 @@
-#!/usr/bin/env sh #
-@ 2>/dev/null # 2>nul & echo off #
-:; alias ::='' #
-:: #
-:: # Helper script to run StartupJS app using docker only
-:: # on both Unix and Windows.
-:: # version: 0.1.0
-:: #
-:: #
-:: # --- Bash script (Mac and Linux). Execute in bash console.
-:: #
-:: ROOT="${PWD}" #
-:: DB_FOLDER="${ROOT}/data" #
-:: APP_NAME="app" #
-:: DEV_IMAGE="startupjs/dev" #
-:: DEV_NAME="${APP_NAME}-dev" #
-:: OS_NAME=$( uname -s | tr A-Z a-z ) #
-:: VOLUME_MODE=$( [ "$OS_NAME" = "darwin" ] && echo ":delegated" || echo "" ) #
-:: #
-:: if [ -z "$1" ] || [ "$1" = "run" ]; then docker run --rm -it --name ${DEV_NAME} --ulimit nofile=65535:65535 -p 3000:3000 -p 3010:3010 -v ${DB_FOLDER}:/data/db${VOLUME_MODE} -v ${ROOT}:/ws${VOLUME_MODE} ${DEV_IMAGE}; #
-:: elif [ "$1" = "exec" ]; then docker exec -it ${DEV_NAME} sh; #
-:: else echo "Invalid command. Available:\n  - run (default)\n  - exec"; #
-:: fi #
-:: exit #
-
-
-:: # --- Batch script (Windows). Execute in cmd or in PowerShell.
-:: # TODO
-
-exit /B

package/templates/ui/.eslintrc.json

@@ -1,60 +0,0 @@
-{
-  "root": true,
-  "env": {
-    "browser": true,
-    "es6": true,
-    "node": true,
-    "mocha": true
-  },
-  "extends": [
-    "standard",
-    "standard-react",
-    "plugin:react-pug/all"
-  ],
-  "globals": {
-    "Atomics": "readonly",
-    "SharedArrayBuffer": "readonly"
-  },
-  "parser": "babel-eslint",
-  "parserOptions": {
-    "ecmaFeatures": {
-      "legacyDecorators": true,
-      "jsx": true
-    },
-    "ecmaVersion": 10,
-    "sourceType": "module"
-  },
-  "plugins": [
-    "react",
-    "react-pug",
-    "eslint-plugin-import-helpers"
-  ],
-  "rules": {
-    "prefer-const": "off",
-    "react/jsx-handler-names": "off",
-    "react/prop-types": "off",
-    "react-pug/empty-lines": "off",
-    "react-pug/no-interpolation": "off",
-    "react-pug/prop-types": "off",
-    "react-pug/quotes": "off",
-    "import-helpers/order-imports": [
-      "warn",
-      {
-        "newlinesBetween": "ignore",
-        "groups": [
-          "/^react$/",
-          "/react-native/",
-          "/^react.*/",
-          "/^startupjs/",
-          "/^@?startupjs.*/",
-          "/^@?dmapper.*/",
-          "module",
-          "/components/",
-          ["/helpers/", "/hooks/"],
-          ["sibling", "parent"],
-          "/.\/index.styl/"
-        ]
-      }
-    ]
-  }
-}