fix(cli/fragments/clojurescript): code review improvements

- add a post init note about installing `java` and `clojure` - add an example using the `greet` command - move some resources to the `clojurescript` template - change ports for `shadow-cljs` and `tauri` - update ci pipeline - fix code formatting
tauri-apps · Sep 20, 2022 · 409ac3e · 409ac3e
1 parent 0bef5a5
commit 409ac3e
Show file tree

Hide file tree

Showing 10 changed files with 77 additions and 22 deletions.
diff --git a/.github/workflows/templates-test.yml b/.github/workflows/templates-test.yml
@@ -95,6 +95,9 @@ jobs:
           cargo install --locked trunk
         if: matrix.settings.template == 'yew'
 
+      - run: sudo apt install -y clojure
+        if: matrix.settings.template == 'clojurescript'
+
       - name: download cli artifact
         uses: actions/download-artifact@v3
 
@@ -115,10 +118,6 @@ jobs:
           sudo apt-get update
           sudo apt-get install -y libgtk-3-dev webkit2gtk-4.0 libayatana-appindicator3-dev librsvg2-dev patchelf
 
-      - run: |
-          sudo apt install -y clojure
-        if: matrix.settings.template == 'clojurescript'
-
       - run: ${{ matrix.settings.run_cmd }} tauri build -b none
         if: matrix.settings.manager != 'npm'
         working-directory: tauri-app

diff --git a/.scripts/generate-templates-matrix.js b/.scripts/generate-templates-matrix.js
@@ -16,7 +16,7 @@ const nodeJsTemplates = [
   "next-ts",
   "preact",
   "preact-ts",
-  "clojurescript"
+  "clojurescript",
 ];
 
 const matrixConfig = [

diff --git a/packages/cli/fragments/fragment-clojurescript/_cta_manifest_ b/packages/cli/fragments/fragment-clojurescript/_cta_manifest_
@@ -4,10 +4,8 @@
 
 beforeDevCommand = {{pkg_manager_run_command}} dev
 beforeBuildCommand = {{pkg_manager_run_command}} build
-devPath = http://localhost:3000
+devPath = http://localhost:1420
 distDir = ../dist
-withGlobalTauri = true
 
 [files]
-cljs.svg = public/cljs.svg
 tauri.svg = public/tauri.svg
diff --git a/packages/cli/fragments/fragment-clojurescript/package.json b/packages/cli/fragments/fragment-clojurescript/package.json
@@ -3,14 +3,23 @@
   "private": true,
   "version": "0.0.0",
   "scripts": {
-    "shadow:watch": "npx shadow-cljs watch app test",
-    "shadow:build": "npx shadow-cljs release app",
-    "test:build": "npx shadow-cljs compile ci",
-    "test:run": "npx karma start karma.config.js --single-run",
-    "clean": "rm -rf ./public/js ./target",
-    "dev": "npm run clean && npm run shadow:watch",
-    "test": "npm run clean && npm run test:build && npm run test:run",
-    "build": "npm run clean && npm run shadow:build",
+    "assets:build": "cp ./src/style.css ./public/",
+    "preshadow:watch": "npm run assets:build",
+    "shadow:watch": "npm run shadow-cljs watch app test",
+    "preshadow:build": "npm run assets:build",
+    "shadow:build": "npm run shadow-cljs release app",
+    "preshadow:test": "npm run assets:build",
+    "shadow:test": "npm run shadow-cljs compile ci && npm run karma start karma.config.js --single-run",
+    "clean": "rm -rf ./public/js ./target ./dist",
+    "predev": "npm run clean",
+    "dev": "npm run shadow:watch",
+    "pretest": "npm run clean",
+    "test": "npm run shadow:test",
+    "prebuild": "npm run clean",
+    "build": "npm run shadow:build",
+    "postbuild": "cp -R ./public ./dist",
+    "karma": "karma",
+    "shadow-cljs": "shadow-cljs",
     "tauri": "tauri"
   },
   "devDependencies": {

diff --git a/packages/cli/fragments/_assets_/cljs.svg → ...ts/fragment-clojurescript/public/cljs.svg b/packages/cli/fragments/_assets_/cljs.svg → ...ts/fragment-clojurescript/public/cljs.svg
diff --git a/packages/cli/fragments/fragment-clojurescript/public/index.html b/packages/cli/fragments/fragment-clojurescript/public/index.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/cljs.svg" />
+    <link rel="stylesheet" href="/style.css" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Tauri + ClojureScript</title>
   </head>

diff --git a/packages/cli/fragments/fragment-clojurescript/shadow-cljs.edn b/packages/cli/fragments/fragment-clojurescript/shadow-cljs.edn
@@ -2,8 +2,8 @@
 
  :nrepl {:init-ns user}
 
- :dev-http {3000 "public"
-            3001 "target/test"}
+ :dev-http {1420 "public"
+            1421 "target/test"}
 
  :build-defaults {:closure-defines {goog.DEBUG true}
                   :compiler-options {:output-feature-set :es-next}}

diff --git a/packages/cli/fragments/fragment-clojurescript/src/main/clojure/app/core.cljs b/packages/cli/fragments/fragment-clojurescript/src/main/clojure/app/core.cljs
@@ -1,21 +1,56 @@
 (ns app.core
   (:require
-   [goog.dom :as gdom]
-   [reagent.dom :as dom]))
+    ["@tauri-apps/api/tauri" :as tauri]
+    [goog.dom :as gdom]
+    [reagent.core :as r]
+    [reagent.dom :as dom]))
 
 
 (defn square
   [x]
   (* x x))
 
 
+;;  Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
+
+(def root
+  (let [*name (r/atom "")
+        *message (r/atom "")
+        handle-input (fn [new-value]
+                       (reset! *name new-value))
+        greet! (fn [name]
+                 (-> (.invoke tauri "greet" #js {:name name})
+                     (.then (fn [res]
+                              (reset! *message res)))))]
+    (fn []
+      [:div.container
+       [:h1 "Welcome to Tauri!"]
+
+       [:div.row
+        [:a {:href "https://tauri.app" :target "_blank"}
+         [:img {:src "/tauri.svg" :class "logo tauri" :alt "Tauri logo"}]]
+        [:a {:href "https://clojurescript.org" :target "_blank"}
+         [:img {:src "/cljs.svg" :class "logo tauri" :alt "ClojureScript logo"}]]]
+
+       [:p "Click on the Tauri, ClojureScript logos to learn more."]
+
+       [:div.row
+        [:input {:type "text"
+                 :id "greet-input"
+                 :on-change #(handle-input (.. % -target -value))
+                 :placeholder "Enter a name..."}]
+        [:button {:type "button" :on-click #(greet! @*name)} "Greet"]]
+
+       [:p @*message]])))
+
+
 (defn mount-root
   "Mount root component."
   {:dev/after-load true}
   []
   (some->>
-   (gdom/getElement "root")
-   (dom/render [:h1 "Welcome to Tauri!"])))
+    (gdom/getElement "root")
+    (dom/render [root])))
 
 
 (defn -main

diff --git a/packages/cli/node/README.md b/packages/cli/node/README.md
@@ -59,6 +59,7 @@ Currently supported template presets include:
 - `preact`
 - `preact-ts`
 - `angular`
+- `clojurescript`
 
 You can use `.` for the project name to scaffold in the current directory.
 

diff --git a/packages/cli/src/template.rs b/packages/cli/src/template.rs
@@ -87,6 +87,18 @@ impl<'a> Template {
                         BLUE = BLUE,
                     ),
                 ),
+          Template::ClojureScript => Some(
+            format!(
+              "{ITALIC}{DIM}You also need to install{DIMRESET} {YELLOW}java{WHITE} {DIM}(e.g. {DIMRESET}{BLUE}https://adoptium.net{WHITE}{DIM}) and{DIMRESET} {YELLOW}clojure{WHITE} {DIM}({DIMRESET}{BLUE}https://clojure.org/guides/install_clojure{WHITE}{DIM}){DIMRESET}{RESET}",
+              ITALIC = ITALIC,
+              DIM = DIM,
+              DIMRESET = DIMRESET,
+              YELLOW = YELLOW,
+              WHITE = WHITE,
+              BLUE = BLUE,
+              RESET = RESET
+            ),
+          ),
             _ => None,
         }
     }