feat: update Docker image references from GHCR to Docker Hub and enhance documentation

.github/workflows/publish-docker.yml

@@ -1,13 +1,15 @@
 name: Publish Docker Image
 
 on:
-    push:
+  push:
-        tags:
+    tags:
-            - '[0-9][0-9][0-9][0-9].[0-9]*.[0-9]*'
+      - '[0-9][0-9][0-9][0-9].[0-9][0-9].[0-9][0-9]'
+    branches:
+      - main
 
 env:
-  REGISTRY: ghcr.io
+  REGISTRY: docker.io
-  IMAGE_NAME: ${{ github.repository }}
+  IMAGE_NAME: sillyangel/mice
 
 jobs:
   push_to_registry:
@@ -21,12 +23,11 @@ jobs:
       - name: Check out the repo
         uses: actions/checkout@v4
 
-      - name: Login to GitHub Container Registry
+      - name: Login to Docker Hub
         uses: docker/login-action@v3
         with:
-          registry: ${{ env.REGISTRY }}
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          username: ${{ github.repository_owner }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
-          password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Set up Node.js
         uses: actions/setup-node@v4
@@ -40,14 +41,19 @@ jobs:
           echo "version=$VERSION" >> "$GITHUB_OUTPUT"
 
       - name: Docker metadata (tags, labels)
-        id: meta
+  id: meta
-        uses: docker/metadata-action@v5
+  uses: docker/metadata-action@v5
-        with:
+  with:
-          images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
+    images: ${{ env.IMAGE_NAME }}
-          tags: |
+    tags: |
-            type=raw,value=latest,enable=${{ github.ref == 'refs/heads/main' || github.ref == 'refs/heads/master' || startsWith(github.ref, 'refs/tags/') }}
+      type=raw,value=latest,enable=${{ github.ref_name == 'main' }}
-            type=raw,value=${{ steps.app_version.outputs.version }}
+      type=raw,value=${{ steps.app_version.outputs.version }},enable=${{ startsWith(github.ref, 'refs/tags/') }}
-            type=raw,value=${{ github.sha }}
+      type=raw,value=${{ github.ref_name }},enable=${{ startsWith(github.ref, 'refs/tags/') }}
+      type=sha
+    labels: |
+      org.opencontainers.image.created=${{ github.event.head_commit.timestamp }}
+      org.opencontainers.image.licenses=MIT
+
       
       - name: Set up QEMU
         uses: docker/setup-qemu-action@v3
@@ -72,6 +78,6 @@ jobs:
       - name: Generate artifact attestation
         uses: actions/attest-build-provenance@v1
         with:
-          subject-name: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME}}
+          subject-name: ${{ env.IMAGE_NAME }}
           subject-digest: ${{ steps.build.outputs.digest }}
           push-to-registry: true

DOCKER.md

@@ -8,7 +8,7 @@ This application can be easily deployed using Docker with configurable environme
 
 ```bash
 # Run using pre-built image (app will prompt for Navidrome config)
-docker run -p 3000:3000 ghcr.io/sillyangel/mice:latest
+docker run -p 3000:3000 sillyangel/mice:latest
 
 # Or build locally
 docker build -t mice .
@@ -20,7 +20,7 @@ docker run -p 3000:3000 \
   -e NEXT_PUBLIC_NAVIDROME_USERNAME=your_username \
   -e NEXT_PUBLIC_NAVIDROME_PASSWORD=your_password \
   -e PORT=3000 \
-  ghcr.io/sillyangel/mice:latest
+  sillyangel/mice:latest
 ```
 
 ### Using Docker Compose
@@ -43,7 +43,7 @@ docker run -p 3000:3000 \
    docker-compose up -d
    ```
 
-**Note**: The default docker-compose.yml uses the pre-built image `ghcr.io/sillyangel/mice:latest`.
+**Note**: The default docker-compose.yml uses the pre-built image `sillyangel/mice:latest`.
 
 For local development, you can use the override example:
 
@@ -86,7 +86,7 @@ For local development (non-Docker), use these variable names:
 
 ```bash
 # Using pre-built image - app will ask for Navidrome server details on first launch
-docker run -p 3000:3000 ghcr.io/sillyangel/mice:latest
+docker run -p 3000:3000 sillyangel/mice:latest
 
 # Or build locally
 docker build -t mice .
@@ -100,7 +100,7 @@ docker run -p 3000:3000 \
   -e NEXT_PUBLIC_NAVIDROME_URL=http://localhost:4533 \
   -e NEXT_PUBLIC_NAVIDROME_USERNAME=admin \
   -e NEXT_PUBLIC_NAVIDROME_PASSWORD=admin \
-  ghcr.io/sillyangel/mice:latest
+  sillyangel/mice:latest
 ```
 
 ### Pre-configured Production Setup
@@ -112,7 +112,7 @@ docker run -p 80:3000 \
   -e NEXT_PUBLIC_NAVIDROME_PASSWORD=your_secure_password \
   -e PORT=3000 \
   --restart unless-stopped \
-  ghcr.io/sillyangel/mice:latest
+  sillyangel/mice:latest
 ```
 
 ### Using Environment File

GITHUB_ACTIONS.md

@@ -1,13 +1,13 @@
 # GitHub Actions Docker Publishing Setup
 
-This repository includes a GitHub Actions workflow that automatically builds and publishes Docker images to GitHub Container Registry (GHCR).
+This repository includes a GitHub Actions workflow that automatically builds and publishes Docker images to Docker Hub.
 
 ## Workflow Overview
 
 The workflow (`/.github/workflows/publish-docker.yml`) automatically:
 
 1. **Builds** the Docker image using multi-platform support (AMD64 and ARM64)
-2. **Publishes** to `ghcr.io/sillyangel/mice`
+2. **Publishes** to `sillyangel/mice`
 3. **Tags** images appropriately based on git refs
 4. **Caches** layers for faster subsequent builds
 5. **Generates** build provenance attestations for security
@@ -27,16 +27,16 @@ Based on different triggers, the workflow creates these tags:
 
 ### Main Branch Push
 
-- `ghcr.io/sillyangel/mice:latest`
+- `sillyangel/mice:latest`
 
 ### Tag Push (e.g., `2025.07.02`)
 
-- `ghcr.io/sillyangel/mice:2025.07.02`
+- `sillyangel/mice:2025.07.02`
-- `ghcr.io/sillyangel/mice:latest`
+- `sillyangel/mice:latest`
 
 ### Pull Request
 
-- `ghcr.io/sillyangel/mice:pr-123`
+- `sillyangel/mice:pr-123`
 
 ## Multi-Platform Support
 
@@ -51,7 +51,7 @@ Once the workflow is set up:
 
 1. **Push to main** → New `latest` image published
 2. **Create a release** → Versioned images published
-3. **Users can pull**: `docker pull ghcr.io/sillyangel/mice:latest`
+3. **Users can pull**: `docker pull sillyangel/mice:latest`
 
 ## Manual Image Building
 
@@ -60,9 +60,9 @@ You can also build and push manually:
 ```bash
 # Build for multiple platforms
 docker buildx build --platform linux/amd64,linux/arm64 \
-  -t ghcr.io/sillyangel/mice:latest \
+  -t sillyangel/mice:latest \
   --push .
 
 # Login first (if needed)
-echo $GITHUB_TOKEN | docker login ghcr.io -u USERNAME --password-stdin
+echo $DOCKERHUB_TOKEN | docker login -u USERNAME --password-stdin
 ```

README.md

@@ -1,6 +1,6 @@
 <p align="left" style="display: flex; align-items: center; gap: 12px;">
   <img src="https://github.com/sillyangel/mice/blob/main/public/icon-512.png?raw=true" alt="Mice Logo" width="64" style="border-radius: 12px;" />
-  <strong style="font-size: 2em;">Mice | Navidrome Client</strong>
+  <strong style="font-size: 2rem;">Mice | Navidrome Client</strong>
 </p>
 
 #
@@ -91,7 +91,7 @@ For easy deployment using Docker:
 
 ```bash
 # Run using pre-built image (app will prompt for Navidrome configuration)
-docker run -p 3000:3000 ghcr.io/sillyangel/mice:latest
+docker run -p 3000:3000 sillyangel/mice:latest
 
 # Or build locally
 docker build -t mice .
@@ -114,7 +114,7 @@ docker run -p 3000:3000 \
   -e NEXT_PUBLIC_NAVIDROME_URL=http://your-navidrome-server:4533 \
   -e NEXT_PUBLIC_NAVIDROME_USERNAME=your_username \
   -e NEXT_PUBLIC_NAVIDROME_PASSWORD=your_password \
-  ghcr.io/sillyangel/mice:latest
+  sillyangel/mice:latest
 ```
 
 📖 **For detailed Docker configuration, environment variables, troubleshooting, and advanced setups, see [DOCKER.md](./DOCKER.md)**

app/components/start-screen.tsx

@@ -399,6 +399,28 @@ export function LoginForm({
                   required 
                 />
               </div>
+
+              {/* Demo Server Tip */}
+              <div className="bg-blue-50 dark:bg-blue-950/30 border border-blue-200 dark:border-blue-800 rounded-lg p-4">
+                <div className="flex items-start gap-3">
+                  <div className="text-blue-600 dark:text-blue-400 mt-0.5">
+                    💡
+                  </div>
+                  <div className="flex-1 text-sm">
+                    <p className="font-medium text-blue-900 dark:text-blue-100 mb-1">
+                      Don't have a Navidrome server?
+                    </p>
+                    <p className="text-blue-700 dark:text-blue-200 mb-2">
+                      Try the demo server to explore mice:
+                    </p>
+                    <div className="bg-blue-100 dark:bg-blue-900/50 rounded p-2 font-mono text-xs">
+                      <div><strong>URL:</strong> https://demo.navidrome.org</div>
+                      <div><strong>Username:</strong> demo</div>
+                      <div><strong>Password:</strong> demo</div>
+                    </div>
+                  </div>
+                </div>
+              </div>
               
               <div className="flex flex-col gap-3">
                 <Button type="submit" className="w-full" disabled={isTesting}>

docker-compose.example.yml

@@ -3,7 +3,7 @@ version: '3.8'
 services:
   mice:
     container_name: mice-public
-    image: ghcr.io/sillyangel/mice:latest
+    image: sillyangel/mice:latest
     ports:
       - "40625:40625"
     environment:

docker-compose.yml

@@ -2,7 +2,7 @@ version: '3.8'
 
 services:
   mice:
-    image: ghcr.io/sillyangel/mice:latest
+    image: sillyangel/mice:latest
     ports:
       - "${HOST_PORT:-3000}:${PORT:-3000}"
     environment: