hide thumbnail if not enabled

Dockerfile

@@ -1,38 +1,13 @@
 # syntax=docker/dockerfile:1
-FROM node:20-slim AS base
+FROM node:20-alpine AS base
 
 ENV PNPM_HOME="/pnpm"
 ENV PATH="$PNPM_HOME:$PATH"
 RUN corepack enable
 
-# Setup nsite user
+RUN apk update && apk add --no-cache nginx supervisor
-RUN groupadd -r nsite && useradd -r -g nsite -G audio,video nsite && usermod -d /app nsite
-
-# Install nginx and supervisor
-RUN apt-get update && apt-get install -y nginx supervisor
-
-# setup supervisor
 COPY supervisord.conf /etc/supervisord.conf
 
-# Setup nginx
-COPY nginx/nginx.conf /etc/nginx/nginx.conf
-COPY nginx/default.conf /etc/nginx/conf.d/default.conf
-RUN chown nsite:nsite -R /etc/nginx
-
-# install google chrome for screenshots. copied from (https://pptr.dev/troubleshooting#running-puppeteer-in-docker)
-
-# Install latest chrome dev package and fonts to support major charsets (Chinese, Japanese, Arabic, Hebrew, Thai and a few others)
-# Note: this installs the necessary libs to make the bundled version of Chrome for Testing that Puppeteer
-# installs, work.
-RUN apt-get update \
-    && apt-get install -y wget gnupg \
-    && wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \
-    && sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list' \
-    && apt-get update \
-    && apt-get install -y google-chrome-stable fonts-ipafont-gothic fonts-wqy-zenhei fonts-thai-tlwg fonts-kacst fonts-freefont-ttf libxss1 \
-      --no-install-recommends \
-    && rm -rf /var/lib/apt/lists/*
-
 WORKDIR /app
 COPY package.json .
 COPY pnpm-lock.yaml .
@@ -48,6 +23,14 @@ RUN pnpm build
 
 FROM base AS main
 
+# Setup user
+RUN addgroup -S nsite && adduser -S nsite -G nsite
+RUN chown -R nsite:nsite /app
+
+# Setup nginx
+COPY nginx/nginx.conf /etc/nginx/nginx.conf
+COPY nginx/default.conf /etc/nginx/conf.d/default.conf
+
 # setup nsite
 COPY --from=prod-deps /app/node_modules /app/node_modules
 COPY --from=build ./app/build ./build
@@ -56,21 +39,14 @@ COPY ./public ./public
 COPY tor-and-i2p.pac proxy.pac
 
 VOLUME [ "/var/cache/nginx" ]
-VOLUME [ "/screenshots" ]
 
 EXPOSE 80 3000
 ENV NSITE_PORT="3000"
 ENV NGINX_CACHE_DIR="/var/cache/nginx"
-ENV ENABLE_SCREENSHOTS="true"
+ENV ENABLE_SCREENSHOTS="false"
-ENV SCREENSHOTS_DIR="/screenshots"
-ENV PUPPETEER_SKIP_DOWNLOAD="true"
 
 COPY docker-entrypoint.sh /
 RUN chmod +x /docker-entrypoint.sh
-
-# change ownership of app
-RUN chown nsite:nsite -R /app
-
-# Run /docker-entrypoint as root so supervisor can run
 ENTRYPOINT ["/docker-entrypoint.sh"]
+
 CMD ["/usr/bin/supervisord", "-c", "/etc/supervisord.conf"]

Dockerfile-screenshots

@@ -0,0 +1,76 @@
+# syntax=docker/dockerfile:1
+FROM node:20-slim AS base
+
+ENV PNPM_HOME="/pnpm"
+ENV PATH="$PNPM_HOME:$PATH"
+RUN corepack enable
+
+# Setup nsite user
+RUN groupadd -r nsite && useradd -r -g nsite -G audio,video nsite && usermod -d /app nsite
+
+# Install nginx and supervisor
+RUN apt-get update && apt-get install -y nginx supervisor
+
+# setup supervisor
+COPY supervisord.conf /etc/supervisord.conf
+
+# Setup nginx
+COPY nginx/nginx.conf /etc/nginx/nginx.conf
+COPY nginx/default.conf /etc/nginx/conf.d/default.conf
+RUN chown nsite:nsite -R /etc/nginx
+
+# install google chrome for screenshots. copied from (https://pptr.dev/troubleshooting#running-puppeteer-in-docker)
+
+# Install latest chrome dev package and fonts to support major charsets (Chinese, Japanese, Arabic, Hebrew, Thai and a few others)
+# Note: this installs the necessary libs to make the bundled version of Chrome for Testing that Puppeteer
+# installs, work.
+RUN apt-get update \
+    && apt-get install -y wget gnupg \
+    && wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \
+    && sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list' \
+    && apt-get update \
+    && apt-get install -y google-chrome-stable fonts-ipafont-gothic fonts-wqy-zenhei fonts-thai-tlwg fonts-kacst fonts-freefont-ttf libxss1 \
+      --no-install-recommends \
+    && rm -rf /var/lib/apt/lists/*
+
+WORKDIR /app
+COPY package.json .
+COPY pnpm-lock.yaml .
+
+FROM base AS prod-deps
+RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --prod --frozen-lockfile
+
+FROM base AS build
+RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --frozen-lockfile
+COPY tsconfig.json .
+COPY src ./src
+RUN pnpm build
+
+FROM base AS main
+
+# setup nsite
+COPY --from=prod-deps /app/node_modules /app/node_modules
+COPY --from=build ./app/build ./build
+
+COPY ./public ./public
+COPY tor-and-i2p.pac proxy.pac
+
+VOLUME [ "/var/cache/nginx" ]
+VOLUME [ "/screenshots" ]
+
+EXPOSE 80 3000
+ENV NSITE_PORT="3000"
+ENV NGINX_CACHE_DIR="/var/cache/nginx"
+ENV ENABLE_SCREENSHOTS="true"
+ENV SCREENSHOTS_DIR="/screenshots"
+ENV PUPPETEER_SKIP_DOWNLOAD="true"
+
+COPY docker-entrypoint.sh /
+RUN chmod +x /docker-entrypoint.sh
+
+# change ownership of app
+RUN chown nsite:nsite -R /app
+
+# Run /docker-entrypoint as root so supervisor can run
+ENTRYPOINT ["/docker-entrypoint.sh"]
+CMD ["/usr/bin/supervisord", "-c", "/etc/supervisord.conf"]

docker-compose.yml

@@ -1,6 +1,5 @@
 version: "3.7"
 
-
 services:
   nsite:
     build: .
@@ -9,10 +8,6 @@ services:
       LOOKUP_RELAYS: wss://user.kindpag.es,wss://purplepag.es
       SUBSCRIPTION_RELAYS: wss://nostrue.com/,wss://nos.lol/,wss://relay.damus.io/,wss://purplerelay.com/
     volumes:
-      - type: tmpfs
-        target: /screenshots
-        tmpfs:
-          size: 100M
       - type: tmpfs
         target: /var/cache/nginx
         tmpfs:

public/components/nsite-card.js

@@ -58,10 +58,12 @@ export class NsiteCard extends LitElement {
   static properties = {
     nsite: { type: Object },
     profile: { state: true, type: Object },
+    hasThumb: { state: true, type: Boolean },
   };
 
   constructor() {
     super();
+    this.hasThumb = true;
   }
 
   connectedCallback() {
@@ -72,14 +74,22 @@ export class NsiteCard extends LitElement {
     });
   }
 
+  handleError() {
+    this.hasThumb = false;
+  }
+
   render() {
     const npub = nip19.npubEncode(this.nsite.pubkey);
     const url = new URL("/", `${location.protocol}//${npub}.${location.host}`);
 
     return html`
-      <a class="thumb" href="${url}" target="_blank">
+      ${this.hasThumb
-        <img src="/screenshot/${this.nsite.pubkey}.png" />
+        ? html`
-      </a>
+            <a class="thumb" href="${url}" target="_blank">
+              <img src="/screenshot/${this.nsite.pubkey}.png" @error=${this.handleError} />
+            </a>
+          `
+        : undefined}
       <a class="title" href="${url}" target="_blank">
         ${this.profile && html`<img src="${this.profile.image || this.profile.picture}" class="avatar" />`}
         <div>

src/env.ts

@@ -24,7 +24,7 @@ const NSITE_HOST = process.env.NSITE_HOST || "0.0.0.0";
 const NSITE_PORT = process.env.NSITE_PORT ? parseInt(process.env.NSITE_PORT) : 3000;
 const HOST = `${NSITE_HOST}:${NSITE_PORT}`;
 
-const ENABLE_SCREENSHOTS = process.env.SCREENSHOTS_DIR !== "false";
+const ENABLE_SCREENSHOTS = process.env.ENABLE_SCREENSHOTS === "true";
 const SCREENSHOTS_DIR = process.env.SCREENSHOTS_DIR || "./screenshots";
 
 export {

src/index.ts

@@ -25,7 +25,6 @@ import {
 import { userDomains, userRelays, userServers } from "./cache.js";
 import { invalidatePubkeyPath } from "./nginx.js";
 import pool, { getUserOutboxes, subscribeForEvents } from "./nostr.js";
-import { getScreenshotPath, hasScreenshot, removeScreenshot, takeScreenshot } from "./screenshots.js";
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 
@@ -165,6 +164,7 @@ if (ENABLE_SCREENSHOTS) {
       const [pubkey, etx] = basename(ctx.path).split(".");
 
       if (pubkey) {
+        const { hasScreenshot, takeScreenshot, getScreenshotPath } = await import("./screenshots.js");
         if (!(await hasScreenshot(pubkey))) await takeScreenshot(pubkey);
 
         await send(ctx, getScreenshotPath(pubkey));
@@ -190,7 +190,8 @@ if (SUBSCRIPTION_RELAYS.length > 0) {
         }
 
         // invalidate screenshot for nsite
-        if ((ENABLE_SCREENSHOTS && nsite.path === "/") || nsite.path === "/index.html") {
+        if (ENABLE_SCREENSHOTS && (nsite.path === "/" || nsite.path === "/index.html")) {
+          const { removeScreenshot } = await import("./screenshots.js");
           await removeScreenshot(nsite.pubkey);
         }
       }