From 4392633043f79e862677562e1d548dd9250a5f9b Mon Sep 17 00:00:00 2001
From: Matthias Andrasch <777278+mandrasch@users.noreply.github.com>
Date: Sat, 25 May 2024 13:04:07 +0200
Subject: [PATCH 1/6] feat: add gitpod support, clean up codespaces (WIP)

---
 .ddev/config.yaml                             |  1 +
 .devcontainer/postCreateCommand.sh            | 43 ++++--------
 .../docker-compose.vite-workaround.yaml       |  7 ++
 .gitignore                                    |  4 +-
 .gitpod.yml                                   | 70 +++++++++++++++++++
 .gitpod/project-setup.sh                      | 44 ++++++++++++
 .../docker-compose.vite-workaround.yaml       |  7 ++
 .gitpod/templates/launch.json                 | 42 +++++++++++
 README.md                                     | 12 +++-
 config/vite.php                               | 11 ++-
 vite.config.js                                | 37 ++++------
 11 files changed, 218 insertions(+), 60 deletions(-)
 create mode 100644 .devcontainer/templates/docker-compose.vite-workaround.yaml
 create mode 100644 .gitpod.yml
 create mode 100755 .gitpod/project-setup.sh
 create mode 100644 .gitpod/templates/docker-compose.vite-workaround.yaml
 create mode 100644 .gitpod/templates/launch.json

diff --git a/.ddev/config.yaml b/.ddev/config.yaml
index 9942e1d..5cc785b 100644
--- a/.ddev/config.yaml
+++ b/.ddev/config.yaml
@@ -14,6 +14,7 @@ database:
 use_dns_when_possible: true
 composer_version: "2"
 web_environment:
+    - GITPOD_WORKSPACE_URL
     - CODESPACES
     - CODESPACE_NAME
     - GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN
diff --git a/.devcontainer/postCreateCommand.sh b/.devcontainer/postCreateCommand.sh
index 6d2af35..505fe55 100755
--- a/.devcontainer/postCreateCommand.sh
+++ b/.devcontainer/postCreateCommand.sh
@@ -21,6 +21,7 @@ wait_for_docker() {
 
 wait_for_docker
 
+# TODO: remove, might not be needed (auto-detected)
 # https://github.com/ddev/ddev/pull/5290#issuecomment-1689024764
 ddev config global --omit-containers=ddev-router
 
@@ -30,35 +31,17 @@ ddev debug download-images
 # avoid errors on rebuilds
 ddev poweroff
 
-# Workaround for vite:
-# We expose port 5174 for vite on codespaces, because ddev-router is not used  on codespace instances. 
-# Routing is handled by codespaces itself. This will  create an additional config file for DDEV 
-# which will expose port 5174. This port needs to be set to  public + HTTPS manually in ports tab, 
-# otherwise CORS errors will occur. See config/vite.php and vite.config.js as well. 
-
-if [ ! -f ".ddev/docker-compose.codespaces-vite.yaml" ]; then
-    echo "Creating vite port workaround file for port exposing ..."
-    # create workaround file for port exposing (if it does not exist yet)
-    # info: this file should not be commited to git since it shouldn't be used on local DDEV
-    cat >.ddev/docker-compose.codespaces-vite.yaml <<EOL
-services:
-  web:
-    ports:
-    - 5174:5174
-EOL
-
-fi
-
-# start ddev project
-ddev start -y
-
-# DDEV will automatically set the codespaces preview URL in .env. 
-# If this is not working in future, you can use this snippet for replacement:
-# ddev exec 'sed -i "/PRIMARY_SITE_URL=/c APP_URL=$DDEV_PRIMARY_URL" .env'
+# Workaround for Vite:
+# Normally expose port 5173 for Vite in .ddev/config.yaml, but ddev-router 
+# is not used  on Gitpod / Codespaces, etc. The Routing is handled by Gitpod /
+# Codespaces itself. Therefore we will create an additional config file for 
+# DDEV which will expose port 5173 without ddev-router.
+cp .gitpod/templates/docker-compose.vite-workaround.yaml .ddev/.
 
-# Current workaround for https://github.com/ddev/ddev/issues/5256, 
-# can be removed later if PR is merged in next ddev version
-ddev exec 'sed -i "s/preview.app.github.dev/app.github.dev/g" .env'
+# Start the DDEV project
+# (will automatically get URL from env, adds db connection to .env)
+export DDEV_NONINTERACTIVE=true
+ddev start -y
 
 # normal project setup
 ddev composer install 
@@ -76,10 +59,10 @@ ddev craft install/craft \
   --email=admin@example.com \
   --site-name=Testsite
 
-# You could also remove it here and run this in codespaces terminal, it will just prompt for your password:
+# You could also remove it here and run this in terminal, it will just prompt for your password:
 # ddev craft install/craft --username=admin --email=admin@example.com --site-name=Testsite
 
-# If craft was also installed (e.g. when you do a codespaces rebuild/full rebuild), this command
+# If craft was also installed (e.g. when you do a rebuild/full rebuild), this command
 # will just state "craft already installed". 
 
 # install the vite plugin by nystudio107 after fresh install
diff --git a/.devcontainer/templates/docker-compose.vite-workaround.yaml b/.devcontainer/templates/docker-compose.vite-workaround.yaml
new file mode 100644
index 0000000..d186911
--- /dev/null
+++ b/.devcontainer/templates/docker-compose.vite-workaround.yaml
@@ -0,0 +1,7 @@
+# See postCreateCommand.sh for more information - expose the Vite port without using 
+# ddev router (disabled on Gitpod/Codespaces,etc.). This file should not be committed 
+# to git since it conflicts with local DDEV usage (with ddev router)
+services:
+  web:
+    ports:
+    - 5173:5173
\ No newline at end of file
diff --git a/.gitignore b/.gitignore
index 2ae5437..8649599 100644
--- a/.gitignore
+++ b/.gitignore
@@ -7,5 +7,5 @@
 # vite builds
 /web/dist/
 
-# config file only used for exposing vite port on codespaces
-/.ddev/docker-compose.codespaces-vite.yaml
\ No newline at end of file
+# only needed for gitpod and codespaces
+.ddev/docker-compose.vite-workaround.yaml
\ No newline at end of file
diff --git a/.gitpod.yml b/.gitpod.yml
new file mode 100644
index 0000000..311f8e5
--- /dev/null
+++ b/.gitpod.yml
@@ -0,0 +1,70 @@
+# ddev v1.23.1
+# https://github.com/ddev/ddev-gitpod-launcher
+# https://hub.docker.com/r/ddev/ddev-gitpod-base
+image: ddev/ddev-gitpod-base:20240516
+
+# Based on 
+# https://github.com/ddev/ddev-gitpod-launcher/blob/main/.gitpod.yml
+# https://github.com/shaal/DrupalPod/blob/main/.gitpod.yml
+
+# ddev and composer are running as part of the prebuild
+# when starting a Gitpod workspace all docker images are ready
+tasks:
+  - name: prepare
+    init: |
+      ddev debug download-images
+    command: |
+      chmod +x .gitpod/project-setup.sh
+      .gitpod/project-setup.sh
+      gp ports await 8080 && sleep 1 && gp preview $(gp url 8080)
+      echo "The system is ready, happy developing!"
+      code resources/css/app.css
+      ddev npm run dev
+      
+vscode:
+  extensions:
+    # PHP extensions.
+    - felixfbecker.php-debug
+    - bmewburn.vscode-intelephense-client
+
+    # Prettier
+    - esbenp.prettier-vscode	
+
+    # Twig
+    - mblode.twig-language-2
+    # - moetelo.twiggy
+    # or use https://github.com/zackad/prettier-plugin-twig-melody
+
+    # Bash extensions.
+    - timonwong.shellcheck
+    - rogalmic.bash-debug
+
+ports:
+  # Vite port
+  - port: 5173
+    onOpen: ignore
+    visibility: public
+  # Used by ddev - local db clients
+  - port: 3306
+    onOpen: ignore
+  # Used by projector
+  - port: 6942
+    onOpen: ignore
+  # Used by Mailpit
+  - port: 8025
+    onOpen: ignore
+  # Mailpit web UI
+  - port: 8027
+    onOpen: ignore
+  # Direct-connect ddev-webserver port that is the main port
+  - port: 8080
+    onOpen: ignore
+  # Ignore host https port
+  - port: 8443
+    onOpen: ignore
+  # xdebug port
+  - port: 9003
+    onOpen: ignore
+  # projector port
+  - port: 9999
+    onOpen: open-browser
\ No newline at end of file
diff --git a/.gitpod/project-setup.sh b/.gitpod/project-setup.sh
new file mode 100755
index 0000000..383f8bf
--- /dev/null
+++ b/.gitpod/project-setup.sh
@@ -0,0 +1,44 @@
+#!/usr/bin/env bash
+
+# Prepare vscode-xdebug setup
+mkdir -p .vscode
+cp .gitpod/templates/launch.json .vscode/.
+
+# Workaround for Vite:
+# Normally expose port 5173 for Vite in .ddev/config.yaml, but ddev-router 
+# is not used  on Gitpod / Codespaces, etc. The Routing is handled by Gitpod /
+# Codespaces itself. Therefore we will create an additional config file for 
+# DDEV which will expose port 5173 without ddev-router.
+cp .gitpod/templates/docker-compose.vite-workaround.yaml .ddev/.
+
+# Start the DDEV project 
+# (will automatically get URL from env, adds db connection to .env)
+export DDEV_NONINTERACTIVE=true
+ddev start -y
+
+# Prepare Laravel website
+ddev composer install
+ddev npm install
+
+ddev craft install/craft \
+  --interactive=0 \
+  --username=admin \
+  --password=newPassword \
+  --email=admin@example.com \
+  --site-name=Testsite
+
+# You could also remove it here and run this in terminal, it will just prompt for your password:
+# ddev craft install/craft --username=admin --email=admin@example.com --site-name=Testsite
+
+# If craft was also installed (e.g. when you do a rebuild/full rebuild), this command
+# will just state "craft already installed". 
+
+# install the vite plugin by nystudio107 after fresh install
+ddev craft plugin/install vite
+
+# Further steps - you could also import a database here:
+# ddev import-db --file=dump.sql.gz
+# if you import a dump, you might need:
+# ddev craft setup/keys
+# or use 'ddev pull' to get latest db / files from remote
+# https://ddev.readthedocs.io/en/stable/users/providers/
\ No newline at end of file
diff --git a/.gitpod/templates/docker-compose.vite-workaround.yaml b/.gitpod/templates/docker-compose.vite-workaround.yaml
new file mode 100644
index 0000000..d186911
--- /dev/null
+++ b/.gitpod/templates/docker-compose.vite-workaround.yaml
@@ -0,0 +1,7 @@
+# See postCreateCommand.sh for more information - expose the Vite port without using 
+# ddev router (disabled on Gitpod/Codespaces,etc.). This file should not be committed 
+# to git since it conflicts with local DDEV usage (with ddev router)
+services:
+  web:
+    ports:
+    - 5173:5173
\ No newline at end of file
diff --git a/.gitpod/templates/launch.json b/.gitpod/templates/launch.json
new file mode 100644
index 0000000..986e0e2
--- /dev/null
+++ b/.gitpod/templates/launch.json
@@ -0,0 +1,42 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+    {
+        "label": "Auto-open css file",
+        "type": "shell",
+        "command": "code resources/css/app.css",
+        "runOptions": {
+            "runOn": "folderOpen"
+        },
+        "presentation": {
+            "echo": true,
+            "reveal": "silent",
+            "focus": false,
+            "panel": "shared",
+            "showReuseMessage": false,
+            "clear": false
+        }
+    },
+    {
+        "name": "Listen for XDebug",
+        "type": "php",
+        "request": "launch",
+        "hostname": "0.0.0.0",
+        "port": 9003,
+        "pathMappings": {
+            "/var/www/html": "${workspaceRoot}"
+        }
+    },
+    {
+        "type": "bashdb",
+        "request": "launch",
+        "name": "Bash-Debug (select script from list of sh files)",
+        "cwd": "${workspaceFolder}",
+        "program": "${command:SelectScriptName}",
+        "args": []
+    }
+    ]
+}
\ No newline at end of file
diff --git a/README.md b/README.md
index c416ff0..e35e8d9 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,16 @@
 # ddev-craftcms-vite 
 
+TODO: replace link
+
+[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/mandrasch/ddev-laravel-vite/tree/feat-add-gitpod)
+
 Simple demo for [CraftCMS v5](https://craftcms.com/) + [DDEV](https://ddev.com/), including support for [nystudio107/craft-vite](https://github.com/nystudio107/craft-vite). Have fun with it!
 
-You can run this 1. on your local laptop or 2. on GitHub Codespaces (experimental).
+You can run this 
+
+1. on your local laptop
+1. on Gitpod in your browser
+1. on GitHub Codespaces (experimental)
 
 ## 1. Local setup (after clone)
 
@@ -43,6 +51,8 @@ ddev npm run dev
 
 ## 2. Setup in Codespaces
 
+Disclaimer - May 2024: Codespaces is currently a bit buggy on startups, see https://github.com/devcontainers/features/issues/977.
+
 [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/mandrasch/ddev-craftcms-vite)
 
 1. Click the button
diff --git a/config/vite.php b/config/vite.php
index c2395b3..fb46200 100644
--- a/config/vite.php
+++ b/config/vite.php
@@ -6,13 +6,18 @@
 // Adjustments for DDEV (local) or DDEV + codespaces
 // (if you want to detect if DDEV is used, you can check App::env('IS_DDEV_PROJECT'))
 
-// default, local DDEV (via ddev-router)
+// defaults for local DDEV
 $port = 5173;
 $devServerPublic = App::env('PRIMARY_SITE_URL') . ':' . $port;
 
-// DDEV + codespaces (without ddev-router), switch to port 5174
+// Gitpod support
+if (App::env('GITPOD_WORKSPACE_URL') !== null) {
+	$gitpodWorkspaceUrl = App::env('GITPOD_WORKSPACE_URL');
+	$devServerPublic = str_replace("https://", "https://5173-", $gitpodWorkspaceUrl);
+}
+
+// Codespaces support
 if (App::env('CODESPACES') === true) {
-	$port = 5174;
 	$devServerPublic = "https://" . App::env('CODESPACE_NAME') . "-" . $port . "." . App::env('GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN');
 }
 
diff --git a/vite.config.js b/vite.config.js
index ce7458e..e3b23f9 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,45 +1,34 @@
 // https://www.npmjs.com/package/vite-plugin-restart
 import ViteRestart from 'vite-plugin-restart';
 
-// TODO: import legacy from '@vitejs/plugin-legacy' ? 
-// (https://nystudio107.com/blog/using-vite-js-next-generation-frontend-tooling-with-craft-cms)
-
-// defaults, local DDEV (with ddev-router)
+// defaults, local DDEV
 let port = 5173; 
 let origin = `${process.env.DDEV_PRIMARY_URL}:${port}`;
 
-// for debugging:
-// console.log(process.env);
+// Gitpod support
+// env var GITPOD_WORKSPACE_URL needs to be passed through to ddev, see .ddev/config.yaml
+if(process.env.GITPOD_WORKSPACE_URL){
+    origin = `${process.env.GITPOD_WORKSPACE_URL}`;
+    origin = origin.replace('https://', 'https://5173-');
+    console.log(`Gitpod detected, set origin to ${origin}`);
+}
 
-// DDEV + codespaces (without ddev-router), switch port to 5174
-// (you need to switch the port manually to public on codespaces)
+// Codespaces support
+// env var GITPOD_WORKSPACE_URL needs to be passed through to ddev, see .ddev/config.yaml
+// You need to switch the port manually to public on codespaces after launching
 if (Object.prototype.hasOwnProperty.call(process.env, 'CODESPACES')) {
-    console.log('Codespaces environment detected ...');
-    
-    port = 5174;
     origin = `https://${process.env.CODESPACE_NAME}-${port}.${process.env.GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN}`;
-
-    console.log('Setting config to ', {port,origin});
-
+    console.log('Codespaces environment detected, setting config to ', {port,origin});
     console.log("Please check that this can be opened via browser after you run 'ddev npm run dev':");
     console.log(origin + '/src/js/app.js');
-    console.log('If it can\'t be opened, please switch the vite port to public in the ports tab.');
-
+    console.log('If it can\'t be opened, please switch the Vite port to public in the ports tab.');
     /* console.log({
         'CODESPACES' : process.env?.CODESPACES,
         'CODESPACE_NAME' : process.env?.CODESPACE_NAME,
         'GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN': process.env?.GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN
     });*/
-}else{
-    console.log('Local DDEV detected',{
-        port, origin
-    })
 }
 
-
-// Last step is to set 5173 to PUBLIC in the codespace, else you will get a CORS error. 
-// Unfortunately you cannot specify this in the .devcontainer
-
 export default ({ command }) => ({
     // 'vite' is always command = 'serve', other command is 'build'
     base: command === 'serve' ? '' : '/dist/',

From 3e34c4ebe8e04d2587a9ae9350c0d65169613268 Mon Sep 17 00:00:00 2001
From: Matthias Andrasch <777278+mandrasch@users.noreply.github.com>
Date: Sat, 25 May 2024 13:22:35 +0200
Subject: [PATCH 2/6] chore: minor changes for gitpod + codespaces

---
 .devcontainer/postCreateCommand.sh | 2 +-
 .gitpod.yml                        | 2 +-
 README.md                          | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/.devcontainer/postCreateCommand.sh b/.devcontainer/postCreateCommand.sh
index 505fe55..041735a 100755
--- a/.devcontainer/postCreateCommand.sh
+++ b/.devcontainer/postCreateCommand.sh
@@ -36,7 +36,7 @@ ddev poweroff
 # is not used  on Gitpod / Codespaces, etc. The Routing is handled by Gitpod /
 # Codespaces itself. Therefore we will create an additional config file for 
 # DDEV which will expose port 5173 without ddev-router.
-cp .gitpod/templates/docker-compose.vite-workaround.yaml .ddev/.
+cp .devcontainer/templates/docker-compose.vite-workaround.yaml .ddev/.
 
 # Start the DDEV project
 # (will automatically get URL from env, adds db connection to .env)
diff --git a/.gitpod.yml b/.gitpod.yml
index 311f8e5..20b2a5a 100644
--- a/.gitpod.yml
+++ b/.gitpod.yml
@@ -18,7 +18,7 @@ tasks:
       .gitpod/project-setup.sh
       gp ports await 8080 && sleep 1 && gp preview $(gp url 8080)
       echo "The system is ready, happy developing!"
-      code resources/css/app.css
+      code src/scss/app.scss
       ddev npm run dev
       
 vscode:
diff --git a/README.md b/README.md
index e35e8d9..3c126cf 100644
--- a/README.md
+++ b/README.md
@@ -2,7 +2,7 @@
 
 TODO: replace link
 
-[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/mandrasch/ddev-laravel-vite/tree/feat-add-gitpod)
+[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/mandrasch/ddev-craftcms-vite/)
 
 Simple demo for [CraftCMS v5](https://craftcms.com/) + [DDEV](https://ddev.com/), including support for [nystudio107/craft-vite](https://github.com/nystudio107/craft-vite). Have fun with it!
 

From 3191b78df7823dddb5f81542a9269fb307c76581 Mon Sep 17 00:00:00 2001
From: Matthias Andrasch <777278+mandrasch@users.noreply.github.com>
Date: Sat, 25 May 2024 13:23:27 +0200
Subject: [PATCH 3/6] chore: use fixed nodejs version

---
 .ddev/config.yaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.ddev/config.yaml b/.ddev/config.yaml
index 5cc785b..a2a60fa 100644
--- a/.ddev/config.yaml
+++ b/.ddev/config.yaml
@@ -18,7 +18,7 @@ web_environment:
     - CODESPACES
     - CODESPACE_NAME
     - GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN
-nodejs_version: "20"
+nodejs_version: "20.13.1"
 corepack_enable: false
 web_extra_exposed_ports:
     - name: craft-vite

From 6c20013ec3591d9cd3331110ca45a7edde34a4d4 Mon Sep 17 00:00:00 2001
From: Matthias Andrasch <777278+mandrasch@users.noreply.github.com>
Date: Sat, 25 May 2024 13:49:15 +0200
Subject: [PATCH 4/6] docs: update

---
 README.md | 93 ++++++++++++++++++++++++++++---------------------------
 1 file changed, 47 insertions(+), 46 deletions(-)

diff --git a/README.md b/README.md
index 3c126cf..a9f3960 100644
--- a/README.md
+++ b/README.md
@@ -1,27 +1,28 @@
 # ddev-craftcms-vite 
 
-TODO: replace link
-
 [![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/mandrasch/ddev-craftcms-vite/)
 
 Simple demo for [CraftCMS v5](https://craftcms.com/) + [DDEV](https://ddev.com/), including support for [nystudio107/craft-vite](https://github.com/nystudio107/craft-vite). Have fun with it!
 
 You can run this 
 
-1. on your local laptop
-1. on Gitpod in your browser
-1. on GitHub Codespaces (experimental)
-
-## 1. Local setup (after clone)
+1. on [your local laptop](#1-local-setup)
+1. via [Gitpod in your browser](#2-gitpod)
+1. via [Codespaces (experimental)](#3-codespaces-experimental)
 
-The site will be available here after we're finished:
+See [How was this created?](#how-was-this-created) for more information.
 
-- https://ddev-craftcms-vite.ddev.site/
+## 1. Local setup
 
-These are the first intial steps for a regular local setup:
+Install [DDEV](https://ddev.com/get-started/) and run the following commands:
 
 ```bash
+git clone https://github.com/mandrasch/ddev-craftcms-vite.git
+# or git clone git@github.com:mandrasch/ddev-craftcms-vite.git
+
 cd ddev-craftcms-vite/
+
+# automatically creates .env with correct db settings
 ddev start 
 
 # install dependencies
@@ -43,21 +44,33 @@ ddev craft plugin/install vite
 # Open your website in browser, ...
 ddev launch
 
-# run local dev server (vite), ...
+# start the local dev server (Vite), ...
 ddev npm run dev
 
-# ... and hit reload in browser
+# ... and hit reload in browser. Vite should work now 🥳
 ```
 
-## 2. Setup in Codespaces
+After first time setup, only `ddev npm run dev` is needed (after `ddev start`). 
 
-Disclaimer - May 2024: Codespaces is currently a bit buggy on startups, see https://github.com/devcontainers/features/issues/977.
+Your site is accessible via https://ddev-laravel-vite.ddev.site.
+
+You could also import a database dump via `ddev import-db --file=dump.sql.gz` or use [`ddev pull`](https://ddev.readthedocs.io/en/stable/users/providers/) to setup a project. Use `ddev sequelace` to view your database.
+
+## 2. Gitpod
+
+Just hit the button, wait for the initial setup and start developing:
+
+[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/mandrasch/ddev-craftcms-vite/)
+
+## 3. Codespaces (experimental)
+
+⚠️ Disclaimer - May 2024: Codespaces is currently a bit buggy on startups, see https://github.com/devcontainers/features/issues/977.
 
 [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/mandrasch/ddev-craftcms-vite)
 
 1. Click the button
 1. Wait for `postCreateCommand.sh` to be finished
-1. Switch vite port to public in ports tab
+1. Switch Vite port to public in ports tab
 1. Run `ddev npm run dev`
 1. Open site (web http) via ports tab (or use `ddev launch` in future (currently small bug to be fixed)).
 
@@ -74,42 +87,17 @@ Login via user `admin` and password `newPassword` .
 
 ### Troubleshooting
 
-See creation log via 'CMD + P > View creation log' if errors occur. Unfortunately there is no general error notification when this fails. But if there is only one port in the ports tab installation did not succeed.
-
-Sometimes only a full rebuild solve the problems, use
+See creation log via 'CMD + P > View creation log' if errors occur. Unfortunately there is no general error notification when this fails. But if there is only one port in the ports tab installation did not succeed. Sometimes only a full rebuild solve the problems, use:
 
 - `SHIFT + CMD + P > Codespaces: Full rebuild` 
 
 Containers and db will be deleted.
 
-#### Could not connect to a docker provider
-
-The error `Could not connect to a docker provider. Please start or install a docker provider.` occurs from 1 time out of 5, could not figure out why exactly yet. Please always make sure you're using `"ghcr.io/devcontainers/features/docker-in-docker:2": {},`, not v1.
-
-- Posted it here: https://github.com/orgs/community/discussions/63776
-
-#### Disk space errors
-
-Also `Your docker install has only 2163760 available disk space, less than 5000000 warning level (94% used). Please increase disk image size. ` errors occur from time to time as well.
-
-### Technical background: workaround for vite port
-
-Since the ddev router is not used on codespaces, the vite setup requires some adjustments. To access vite we expose another port (5174) via `.ddev/docker-compose.codespaces-vite.yaml`. This file is generated on codespace start up (and gitignored). 
-
-We needed to adjust some config values in `config/vite.php` and `vite.config.js` as well when codespaces is used. If codespace is used, the new port 5174 needs to be used (instead of the port 5173 for local DDEV setups).
-
-I implemented this via `.env`. 
-
-See `.devcontainers/postCreateCommand.sh` for all steps.
-
-
-
 ## Simulate production environment
 
 1. `ddev npm run build`
 2. Switch `CRAFT_ENVIRONMENT=dev` to `CRAFT_ENVIRONMENT=production` in `.env`
 
-
 ## How was this created?
 
 1. Followed the official [DDEV Quickstart for CraftCMS](https://ddev.readthedocs.io/en/latest/users/quickstart/#craft-cms)
@@ -197,18 +185,31 @@ Add the following scripts to `package.json`:
 
 8. Updated from v4 to v5 https://craftcms.com/docs/5.x/upgrade.html
 
+## Reset the demo
+
+```bash
+# delete without snapshot
+ddev delete -O
+# reset files, beware: deletes all untracked files!
+git clean -fdx
+# reset files, but not .ddev
+git clean -fdx -e .ddev/
+```
+
 ## Acknowledgements
 
 Thanks to the DDEV maintainers and DDEV open source community, especially [Randy Fay](https://github.com/rfay) for suggestions and feedback! 💚
 
-- Thanks to [@superflausch](https://github.com/superflausch) for a quick chat about Codespaces + vite + craft integration.
-- Thanks to [dotsandlines](https://craftcms.com/partners/dotsandlines) for the opportunity to learn more about codespaces usage.
+Huge thanks to ...
+
+- [nystudio107](https://nystudio107.com/) for providing the open source Vite plugin for Craft CMS.
+- [@superflausch](https://github.com/superflausch) for a quick chat about Codespaces + Vite + craft integration.
+- [dotsandlines](https://craftcms.com/partners/dotsandlines) for the opportunity to learn more about codespaces usage.
+- [Ofer Shaal](https://github.com/shaal) for providing DrupalPod (base for Gitpod support)
 
 ## Further resources
 
-- https://nystudio107.com/blog/using-vite-js-next-generation-frontend-tooling-with-craft-cms
-- https://github.com/szenario-fordesigners/craft-vite-starter / https://twitter.com/thomasbendl/status/1628741476355112962
-- docker, but not ddev: https://github.com/nystudio107/spin-up-craft
+- Official plugin site: https://plugins.craftcms.com/vite
 
 More experiments and notes about DDEV + vite: https://my-ddev-lab.mandrasch.eu/
 

From 0a6289d68185363639031ebc8b07067e2d55569c Mon Sep 17 00:00:00 2001
From: Matthias Andrasch <777278+mandrasch@users.noreply.github.com>
Date: Sat, 25 May 2024 13:54:32 +0200
Subject: [PATCH 5/6] chore: small improvements for codespaces/gitpod

---
 .devcontainer/devcontainer.json | 2 +-
 vite.config.js                  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index 25409dd..f06f71d 100644
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -26,7 +26,7 @@
       "label": "web https"
     },
     // our custom vite port for ddev + codespaces
-    "5174":{
+    "5173":{
       "label": "vite"
     }
   },
diff --git a/vite.config.js b/vite.config.js
index e3b23f9..421c89f 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -7,7 +7,7 @@ let origin = `${process.env.DDEV_PRIMARY_URL}:${port}`;
 
 // Gitpod support
 // env var GITPOD_WORKSPACE_URL needs to be passed through to ddev, see .ddev/config.yaml
-if(process.env.GITPOD_WORKSPACE_URL){
+if (Object.prototype.hasOwnProperty.call(process.env, 'GITPOD_WORKSPACE_URL')) {
     origin = `${process.env.GITPOD_WORKSPACE_URL}`;
     origin = origin.replace('https://', 'https://5173-');
     console.log(`Gitpod detected, set origin to ${origin}`);

From 53d6bfaa4aa31d953defe3f7d00d70e29a23a8ac Mon Sep 17 00:00:00 2001
From: Matthias Andrasch <777278+mandrasch@users.noreply.github.com>
Date: Sat, 25 May 2024 13:55:44 +0200
Subject: [PATCH 6/6] docs: update

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index a9f3960..1fa800e 100644
--- a/README.md
+++ b/README.md
@@ -50,7 +50,7 @@ ddev npm run dev
 # ... and hit reload in browser. Vite should work now 🥳
 ```
 
-After first time setup, only `ddev npm run dev` is needed (after `ddev start`). 
+After this first time setup, only `ddev npm run dev` is needed (after `ddev start`). 
 
 Your site is accessible via https://ddev-laravel-vite.ddev.site.