Merge pull request #173 from elm-land/@rhg/vite-plugin-elm-watch

📦 Release v0.20.0 – Improved Developer Experience

.github/workflows/node.js.yml

@@ -19,7 +19,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [16,18]
+        node-version: [18,20]
 
     steps:
       - name: "Checkout latest code"

.github/workflows/npm-publish.yml

@@ -17,7 +17,7 @@ jobs:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 18
       - run: npm install
       - run: npm run setup
       - run: npm link
@@ -33,7 +33,7 @@ jobs:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 18
           registry-url: https://registry.npmjs.org/
       - run: npm install
       - run: npm run setup

README.md

@@ -5,7 +5,7 @@
 
 [![Discord](https://badgen.net/discord/members/vnmYFfySbH?icon=discord&label)](https://join.elm.land) [![Twitter](https://badgen.net/badge/icon/twitter?icon=twitter&label&color=00acee)](https://twitter.com/elmland_) [![GitHub](https://badgen.net/badge/icon/github?icon=github&label&color=4078c0)](https://www.github.com/elm-land/elm-land) 
 
-[![Elm Land: Reliable web apps for everyone](https://github.com/elm-land/elm-land/raw/main/elm-land-banner.jpg)](https://elm.land)
+[![Elm Land: Reliable web apps for everyone](https://github.com/elm-land/elm-land/raw/main/docs/elm-land-banner.jpg)](https://elm.land)
 
 
 ## Welcome to our repo!

docs/.vitepress/config.mjs

@@ -1,6 +1,6 @@
 import { defineConfig } from 'vitepress'
 
-const version = '0.19.5'
+const version = '0.20.0'
 
 const sidebar = [
   {

docs/concepts/auth.md

@@ -36,7 +36,7 @@ elm-land customize auth
 By default, all auth-only pages redirect users to the `NotFound_` page when the application starts up. Let's edit our new `src/Auth.elm` file so it automatically passes the user to any pages that need it, but redirects to `/sign-in` if there's no user logged in.
 
 ```elm{7-8,14-28}
-module Auth exposing (User, onPageLoad, viewLoadingPage)
+module Auth exposing (User, onPageLoad, viewCustomPage)
 
 -- ...
 
@@ -66,9 +66,9 @@ onPageLoad shared route =
                 }
 
 
-{-| Used whenever `Auth.Action.showLoadingPage` is returned. -}
-viewLoadingPage : Shared.Model -> Route () -> View Msg
-viewLoadingPage shared route =
+{-| Used whenever `Auth.Action.loadCustomPage` is returned. -}
+viewCustomPage : Shared.Model -> Route () -> View Msg
+viewCustomPage shared route =
     View.none
 ```
 

docs/concepts/cli.md

@@ -15,7 +15,7 @@ detailed breakdown of the documentation you'll see in your terminal.
 ## elm-land init
 
 ```txt
-✨ elm-land init <folder-name> ...... create a new project
+elm-land init <folder-name> ...... create a new project
 ```
 
 #### Description
@@ -37,7 +37,7 @@ be committed to version control.
 ## elm-land server
 
 ```txt
-🚀 elm-land server ................ run a local dev server
+elm-land server ................ run a local dev server
 ```
 
 #### Description
@@ -65,7 +65,7 @@ Next, we're looking to add `elm-watch` to our existing Vite setup. That will com
 ## elm-land build
 
 ```txt
-📦 elm-land build .......... build your app for production
+elm-land build .......... build your app for production
 ```
 
 #### Description
@@ -80,7 +80,7 @@ Visit the [Deploying to production](../guide/deploying) guide to learn how to co
 ## elm-land generate
 
 ```txt
-🪄 elm-land generate ............. generate Elm Land files
+elm-land generate ............. generate Elm Land files
 ```
 
 #### Description
@@ -93,7 +93,7 @@ For those advanced use cases, we've added a specific `generate` command that doe
 ## elm-land add page
 
 ```txt
-📄 elm-land add page <url> ................ add a new page
+elm-land add page <url> ................ add a new page
 ```
 
 #### Description
@@ -125,7 +125,7 @@ __Because there is no command for upgrading an existing page__, we recommend usi
 ## elm-land add layout
 
 ```txt
-🍱 elm-land add layout <name> ........... add a new layout
+elm-land add layout <name> ........... add a new layout
 ```
 
 #### Description
@@ -150,7 +150,7 @@ elm-land add layout Sidebar.Header ... Creates "src/Layouts/Sidebar/Header.elm"
 ## elm-land customize
 
 ```txt
-🔧 elm-land customize <name> .. customize a default module
+elm-land customize <name> .. customize a default module
 ```
 
 #### Description
@@ -176,7 +176,7 @@ elm-land customize auth ................... handle user authentication
 ## elm-land routes
 
 ```txt
-🔍 elm-land routes ........... list all routes in your app
+elm-land routes ........... list all routes in your app
 ```
 
 #### Description
@@ -191,7 +191,7 @@ Here's example output of what you'd see if you ran this command in the ["Pages a
 
 ```txt
 
-  🌈  Elm Land (v0.19.5) found 5 pages in your application
+  🌈  Elm Land (v0.20.0) found 5 pages in your application
   ⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺
   src/Pages/Home_.elm ............... http://localhost:1234/
   src/Pages/SignIn.elm .............. http://localhost:1234/sign-in

docs/guide/deploying.md

@@ -16,7 +16,7 @@ elm-land build
 
 ```txt
 
-🌈  Elm Land (v0.19.5) build was successful.
+🌈  Elm Land (v0.20.0) build was successful.
     ⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺
 ```
 

docs/guide/pages-and-routes.md

@@ -326,7 +326,7 @@ elm-land routes
 
 ```txt
 
-  🌈  Elm Land (v0.19.5) found 6 pages in your application
+  🌈  Elm Land (v0.20.0) found 6 pages in your application
     ⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺⎺
   src/Pages/Home_.elm ........................... /
   src/Pages/SignIn.elm .......................... /sign-in

docs/reference/auth-action.md

@@ -65,12 +65,14 @@ Auth.Action.loadExternalUrl : String -> Auth.Action.Action
 ```
 
 
-### `Auth.Action.showLoadingPage`
+### `Auth.Action.loadCustomPage`
 
-Sometimes it is helpful to wait on the current page while validating if a JWT token is expired. The `showLoadingPage` function will display a static view to the user while they wait.
+Sometimes it is helpful to wait on the current page while validating if a JWT token is expired. The `loadCustomPage` function will display a static view to the user while they wait.
+
+__Note:__ You can use `Auth.viewCustomPage` to specify what to render in each scenario
 
 #### Type definition
 
 ```elm
-Auth.Action.showLoadingPage : View Never -> Auth.Action.Action
+Auth.Action.loadCustomPage : Auth.Action.Action
 ```

examples/05-user-auth/src/Auth.elm

@@ -1,4 +1,4 @@
-module Auth exposing (User, onPageLoad, viewLoadingPage)
+module Auth exposing (User, onPageLoad, viewCustomPage)
 
 import Auth.Action
 import Dict
@@ -32,8 +32,8 @@ onPageLoad shared route =
                 }
 
 
-{-| Renders whenever `Auth.Action.showLoadingPage` is returned from `onPageLoad`.
+{-| Renders whenever `Auth.Action.loadCustomPage` is returned from `onPageLoad`.
 -}
-viewLoadingPage : Shared.Model -> Route () -> View Never
-viewLoadingPage shared route =
+viewCustomPage : Shared.Model -> Route () -> View Never
+viewCustomPage shared route =
     View.fromString "Loading..."

examples/19-tailwindcss/package.json

@@ -13,7 +13,7 @@
   "license": "BSD-3-Clause",
   "devDependencies": {
     "autoprefixer": "^10.4.16",
-    "elm-land": "^0.19.5",
+    "elm-land": "^0.20.0",
     "postcss": "^8.4.32",
     "tailwindcss": "^3.4.0"
   }

examples/20-auth-error-page/.gitignore

@@ -0,0 +1,7 @@
+/dist
+/.elm-land
+/.env
+/elm-stuff
+/node_modules
+.DS_Store
+*.pem

examples/20-auth-error-page/README.md

@@ -0,0 +1,16 @@
+# 20-auth-error-page
+> Built with [Elm Land](https://elm.land) 🌈
+
+## Local development
+
+```bash
+# Requires Node.js v18+ (https://nodejs.org)
+npx elm-land server
+```
+
+## Deploying to production
+
+Elm Land projects are most commonly deployed as static websites. 
+
+Please visit [the "Deployment" guide](https://elm.land/guide/deploying) to learn more
+about deploying your app for free using Netlify or Vercel.

examples/20-auth-error-page/elm-land.json

@@ -0,0 +1,27 @@
+{
+  "app": {
+    "elm": {
+      "development": { "debugger": true },
+      "production": { "debugger": false }
+    },
+    "env": [],
+    "html": {
+      "attributes": {
+        "html": { "lang": "en" },
+        "head": {}
+      },
+      "title": "Elm Land",
+      "meta": [
+        { "charset": "UTF-8" },
+        { "http-equiv": "X-UA-Compatible", "content": "IE=edge" },
+        { "name": "viewport", "content": "width=device-width, initial-scale=1.0" }
+      ],
+      "link": [],
+      "script": []
+    },
+    "router": {
+      "useHashRouting": false
+    },
+    "proxy": null
+  }
+}

examples/20-auth-error-page/elm.json

@@ -0,0 +1,25 @@
+{
+    "type": "application",
+    "source-directories": [
+        "src",
+        ".elm-land/src"
+    ],
+    "elm-version": "0.19.1",
+    "dependencies": {
+        "direct": {
+            "elm/browser": "1.0.2",
+            "elm/core": "1.0.5",
+            "elm/html": "1.0.0",
+            "elm/json": "1.1.3",
+            "elm/url": "1.0.0"
+        },
+        "indirect": {
+            "elm/time": "1.0.0",
+            "elm/virtual-dom": "1.0.3"
+        }
+    },
+    "test-dependencies": {
+        "direct": {},
+        "indirect": {}
+    }
+}

examples/20-auth-error-page/src/Auth.elm

@@ -0,0 +1,51 @@
+module Auth exposing (User, onPageLoad, viewCustomPage)
+
+import Auth.Action
+import Dict
+import Html
+import Route exposing (Route)
+import Route.Path
+import Shared
+import Shared.Model
+import User
+import View exposing (View)
+
+
+type alias User =
+    User.User
+
+
+{-| Called before an auth-only page is loaded.
+-}
+onPageLoad : Shared.Model -> Route () -> Auth.Action.Action User
+onPageLoad shared route =
+    case shared.authStatus of
+        Shared.Model.NotLoggedIn ->
+            Auth.Action.loadCustomPage
+
+        Shared.Model.LoggedInAs user ->
+            Auth.Action.loadPageWithUser user
+
+        Shared.Model.TokenExpired ->
+            Auth.Action.loadCustomPage
+
+
+{-| Renders whenever `Auth.Action.showCustomView` is returned from `onPageLoad`.
+-}
+viewCustomPage : Shared.Model -> Route () -> View Never
+viewCustomPage shared route =
+    case shared.authStatus of
+        Shared.Model.NotLoggedIn ->
+            { title = "Permission denied"
+            , body = [ Html.text "You need to be logged in to see this!" ]
+            }
+
+        Shared.Model.LoggedInAs user ->
+            { title = "Loading..."
+            , body = []
+            }
+
+        Shared.Model.TokenExpired ->
+            { title = "Token expired"
+            , body = [ Html.text "Your token expired, here's an error page!" ]
+            }