Merge branch 'dev'

README.md

@@ -80,6 +80,7 @@ services:
     image: ghcr.io/gethomepage/homepage:latest
     container_name: homepage
     environment:
+      HOMEPAGE_ALLOWED_HOSTS: gethomepage.dev # required, may need port
       PUID: 1000 # optional, your user id
       PGID: 1000 # optional, your group id
     ports:
@@ -94,6 +95,7 @@ or docker run:
 
 ```bash
 docker run --name homepage \
+  -e HOMEPAGE_ALLOWED_HOSTS=gethomepage.dev \
   -e PUID=1000 \
   -e PGID=1000 \
   -p 3000:3000 \

docs/installation/docker.md

@@ -16,7 +16,7 @@ services:
       - /path/to/config:/app/config # Make sure your local config directory exists
       - /var/run/docker.sock:/var/run/docker.sock # (optional) For docker integrations
     environment:
-      HOMEPAGE_ALLOWED_HOSTS: gethomepage.dev # required when deploying via public URL
+      HOMEPAGE_ALLOWED_HOSTS: gethomepage.dev # required, may need port
 ```
 
 ### Running as non-root
@@ -38,7 +38,7 @@ services:
       - /path/to/config:/app/config # Make sure your local config directory exists
       - /var/run/docker.sock:/var/run/docker.sock # (optional) For docker integrations, see alternative methods
     environment:
-      HOMEPAGE_ALLOWED_HOSTS: gethomepage.dev # required when deploying via public URL
+      HOMEPAGE_ALLOWED_HOSTS: gethomepage.dev # required, may need port
       PUID: $PUID
       PGID: $PGID
 ```

docs/installation/index.md

@@ -29,4 +29,4 @@ You have a few options for deploying homepage, depending on your needs. We offer
 
 ### `HOMEPAGE_ALLOWED_HOSTS`
 
-As of v1.0 there is one required environment variable when deploying via a public URL, <code>HOMEPAGE_ALLOWED_HOSTS</code>. This is a comma separated list of allowed hosts that can access your homepage. See the [docker](docker.md) and [source](source.md) installation pages for examples.
+As of v1.0 there is one required environment variable when deploying via a public URL, <code>HOMEPAGE_ALLOWED_HOSTS</code>. This is a comma separated (no spaces) list of allowed hosts (sometimes with the port) that can access your homepage. See the [docker](docker.md) and [source](source.md) installation pages for examples.

docs/installation/source.md

@@ -21,7 +21,7 @@ If this is your first time starting, copy the `src/skeleton` directory to `confi
 Finally, run the server:
 
 ```bash
-HOMEPAGE_ALLOWED_HOSTS=gethomepage.dev pnpm start
+HOMEPAGE_ALLOWED_HOSTS=gethomepage.dev:1234 pnpm start
 ```
 
 When updating homepage versions you will need to re-build the static files i.e. repeat the process above.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "homepage",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "private": true,
   "scripts": {
     "preinstall": "npx only-allow pnpm",

src/middleware.js

@@ -11,7 +11,7 @@ export function middleware(req) {
   if (!host || !allowedHosts.includes(host)) {
     // eslint-disable-next-line no-console
     console.error(
-      `Host validation failed for: ${host}. Hint: Set the HOMEPAGE_ALLOWED_HOSTS environment variable to allow requests from this host.`,
+      `Host validation failed for: ${host}. Hint: Set the HOMEPAGE_ALLOWED_HOSTS environment variable to allow requests from this host / port.`,
     );
     return NextResponse.json({ error: "Host validation failed. See logs for more details." }, { status: 400 });
   }

src/styles/globals.css

@@ -2,6 +2,10 @@
 
 @config '../../tailwind.config.js';
 
+@theme {
+  --breakpoint-3xl: 112rem;
+}
+
 /*
   The default border color has changed to `currentColor` in Tailwind CSS v4,
   so we've added these compatibility styles to make sure everything still

src/widgets/plex/proxy.js

@@ -111,7 +111,8 @@ export default async function plexProxyHandler(req, res) {
           : `/library/sections/${library._attributes.key}/albums`; // music
         [status, apiData] = await fetchFromPlexAPI(libraryURL, widget);
         if (apiData && apiData.MediaContainer) {
-          const size = parseInt(apiData.MediaContainer._attributes.size, 10);
+          const sizeProp = apiData.MediaContainer._attributes["totalSize"] ? "totalSize" : "size";
+          const size = parseInt(apiData.MediaContainer._attributes[sizeProp], 10);
           if (library._attributes.type === "movie") {
             movies += size;
           } else if (library._attributes.type === "show") {

tailwind.config.js

@@ -30,10 +30,6 @@ module.exports = {
           900: "rgb(var(--color-900) / <alpha-value>)",
         },
       },
-      screens: {
-        "3xl": "1800px",
-        // => @media (min-width: 1800px) { ... }
-      },
     },
   },
   plugins: [tailwindForms, tailwindScrollbars],