mirror of
https://github.com/LemmyNet/lemmy-ui.git
synced 2024-11-29 07:41:13 +00:00
Merge branch 'main' into remove-banned-badge
This commit is contained in:
Dessalines
GitHub
commit
876d6f7803
15 changed files with 1074 additions and 226 deletions
|
|
@ -4,9 +4,13 @@ RUN curl -sf https://gobinaries.com/tj/node-prune | sh
|
|||
|
||||
WORKDIR /usr/src/app
|
||||
|
||||
ENV npm_config_target_arch=x64
|
||||
ENV npm_config_target_platform=linux
|
||||
ENV npm_config_target_libc=musl
|
||||
|
||||
# Cache deps
|
||||
COPY package.json yarn.lock ./
|
||||
RUN yarn install --production --ignore-scripts --prefer-offline --pure-lockfile
|
||||
RUN yarn --production --prefer-offline --pure-lockfile
|
||||
|
||||
# Build
|
||||
COPY generate_translations.js \
|
||||
|
|
@ -22,7 +26,7 @@ COPY .git .git
|
|||
# Set UI version
|
||||
RUN echo "export const VERSION = '$(git describe --tag)';" > "src/shared/version.ts"
|
||||
|
||||
RUN yarn install --production --ignore-scripts --prefer-offline
|
||||
RUN yarn --production --prefer-offline
|
||||
RUN yarn build:prod
|
||||
|
||||
# Prune the image
|
||||
|
|
|
|||
|
|
@ -3,9 +3,13 @@ RUN apk update && apk add curl yarn python3 build-base gcc wget git --no-cache
|
|||
|
||||
WORKDIR /usr/src/app
|
||||
|
||||
ENV npm_config_target_arch=x64
|
||||
ENV npm_config_target_platform=linux
|
||||
ENV npm_config_target_libc=musl
|
||||
|
||||
# Cache deps
|
||||
COPY package.json yarn.lock ./
|
||||
RUN yarn install --ignore-scripts --prefer-offline --pure-lockfile
|
||||
RUN yarn --prefer-offline --pure-lockfile
|
||||
|
||||
# Build
|
||||
COPY generate_translations.js \
|
||||
|
|
@ -20,7 +24,7 @@ COPY src src
|
|||
# Set UI version
|
||||
RUN echo "export const VERSION = 'dev';" > "src/shared/version.ts"
|
||||
|
||||
RUN yarn install --ignore-scripts --prefer-offline
|
||||
RUN yarn --prefer-offline
|
||||
RUN yarn build:dev
|
||||
|
||||
FROM node:alpine as runner
|
||||
|
|
@ -29,4 +33,4 @@ COPY --from=builder /usr/src/app/node_modules /app/node_modules
|
|||
|
||||
EXPOSE 1234
|
||||
WORKDIR /app
|
||||
CMD node dist/js/server.js
|
||||
CMD node dist/js/server.js
|
||||
|
|
@ -1 +1 @@
|
|||
Subproject commit 3bb45c26cb54325c3d8d605f4334447b9b78293a
|
||||
Subproject commit 007e53683768aeba63e9e4c179c1d240217bcee2
|
||||
|
|
@ -44,6 +44,7 @@
|
|||
"classnames": "^2.3.1",
|
||||
"clean-webpack-plugin": "^4.0.0",
|
||||
"copy-webpack-plugin": "^11.0.0",
|
||||
"cross-fetch": "^3.1.5",
|
||||
"css-loader": "^6.7.3",
|
||||
"emoji-mart": "^5.4.0",
|
||||
"emoji-short-name": "^2.0.0",
|
||||
|
|
@ -76,6 +77,7 @@
|
|||
"sass": "^1.62.1",
|
||||
"sass-loader": "^13.2.2",
|
||||
"serialize-javascript": "^6.0.1",
|
||||
"sharp": "^0.32.1",
|
||||
"tippy.js": "^6.3.7",
|
||||
"toastify-js": "^1.12.0",
|
||||
"tributejs": "^5.1.3",
|
||||
|
|
@ -113,7 +115,8 @@
|
|||
"style-loader": "^3.3.2",
|
||||
"terser": "^5.17.3",
|
||||
"typescript": "^5.0.4",
|
||||
"webpack-dev-server": "4.15.0"
|
||||
"webpack-dev-server": "4.15.0",
|
||||
"service-worker-webpack": "^1.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.9.0"
|
||||
|
|
|
|||
|
|
@ -1,49 +0,0 @@
|
|||
{
|
||||
"name": "Lemmy",
|
||||
"description": "A link aggregator for the fediverse",
|
||||
"start_url": "/",
|
||||
"display": "standalone",
|
||||
"background_color": "#222222",
|
||||
"icons": [
|
||||
{
|
||||
"src": "/static/assets/icons/icon-72x72.png",
|
||||
"sizes": "72x72",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "/static/assets/icons/icon-96x96.png",
|
||||
"sizes": "96x96",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "/static/assets/icons/icon-128x128.png",
|
||||
"sizes": "128x128",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "/static/assets/icons/icon-144x144.png",
|
||||
"sizes": "144x144",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "/static/assets/icons/icon-152x152.png",
|
||||
"sizes": "152x152",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "/static/assets/icons/icon-192x192.png",
|
||||
"sizes": "192x192",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "/static/assets/icons/icon-384x384.png",
|
||||
"sizes": "384x384",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "/static/assets/icons/icon-512x512.png",
|
||||
"sizes": "512x512",
|
||||
"type": "image/png"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,23 +1,25 @@
|
|||
import express from "express";
|
||||
import fs from "fs";
|
||||
import { existsSync } from "fs";
|
||||
import { readdir, readFile } from "fs/promises";
|
||||
import { IncomingHttpHeaders } from "http";
|
||||
import { Helmet } from "inferno-helmet";
|
||||
import { matchPath, StaticRouter } from "inferno-router";
|
||||
import { renderToString } from "inferno-server";
|
||||
import IsomorphicCookie from "isomorphic-cookie";
|
||||
import { GetSite, GetSiteResponse, LemmyHttp } from "lemmy-js-client";
|
||||
import { GetSite, GetSiteResponse, LemmyHttp, Site } from "lemmy-js-client";
|
||||
import path from "path";
|
||||
import process from "process";
|
||||
import serialize from "serialize-javascript";
|
||||
import sharp from "sharp";
|
||||
import { App } from "../shared/components/app/app";
|
||||
import { httpBaseInternal } from "../shared/env";
|
||||
import { getHttpBase, getHttpBaseInternal } from "../shared/env";
|
||||
import {
|
||||
ILemmyConfig,
|
||||
InitialFetchRequest,
|
||||
IsoData,
|
||||
} from "../shared/interfaces";
|
||||
import { routes } from "../shared/routes";
|
||||
import { initializeSite } from "../shared/utils";
|
||||
import { favIconPngUrl, favIconUrl, initializeSite } from "../shared/utils";
|
||||
|
||||
const server = express();
|
||||
const [hostname, port] = process.env["LEMMY_UI_HOST"]
|
||||
|
|
@ -54,6 +56,11 @@ Disallow: /password_change
|
|||
Disallow: /search/
|
||||
`;
|
||||
|
||||
server.get("/service-worker.js", async (_req, res) => {
|
||||
res.setHeader("Content-Type", "application/javascript");
|
||||
res.sendFile(path.resolve("./dist/service-worker.js"));
|
||||
});
|
||||
|
||||
server.get("/robots.txt", async (_req, res) => {
|
||||
res.setHeader("content-type", "text/plain; charset=utf-8");
|
||||
res.send(robotstxt);
|
||||
|
|
@ -67,13 +74,13 @@ server.get("/css/themes/:name", async (req, res) => {
|
|||
}
|
||||
|
||||
const customTheme = path.resolve(`./${extraThemesFolder}/${theme}`);
|
||||
if (fs.existsSync(customTheme)) {
|
||||
if (existsSync(customTheme)) {
|
||||
res.sendFile(customTheme);
|
||||
} else {
|
||||
const internalTheme = path.resolve(`./dist/assets/css/themes/${theme}`);
|
||||
|
||||
// If the theme doesn't exist, just send litely
|
||||
if (fs.existsSync(internalTheme)) {
|
||||
if (existsSync(internalTheme)) {
|
||||
res.sendFile(internalTheme);
|
||||
} else {
|
||||
res.sendFile(path.resolve("./dist/assets/css/themes/litely.css"));
|
||||
|
|
@ -81,11 +88,11 @@ server.get("/css/themes/:name", async (req, res) => {
|
|||
}
|
||||
});
|
||||
|
||||
function buildThemeList(): string[] {
|
||||
let themes = ["darkly", "darkly-red", "litely", "litely-red"];
|
||||
if (fs.existsSync(extraThemesFolder)) {
|
||||
let dirThemes = fs.readdirSync(extraThemesFolder);
|
||||
let cssThemes = dirThemes
|
||||
async function buildThemeList(): Promise<string[]> {
|
||||
const themes = ["darkly", "darkly-red", "litely", "litely-red"];
|
||||
if (existsSync(extraThemesFolder)) {
|
||||
const dirThemes = await readdir(extraThemesFolder);
|
||||
const cssThemes = dirThemes
|
||||
.filter(d => d.endsWith(".css"))
|
||||
.map(d => d.replace(".css", ""));
|
||||
themes.push(...cssThemes);
|
||||
|
|
@ -95,7 +102,7 @@ function buildThemeList(): string[] {
|
|||
|
||||
server.get("/css/themelist", async (_req, res) => {
|
||||
res.type("json");
|
||||
res.send(JSON.stringify(buildThemeList()));
|
||||
res.send(JSON.stringify(await buildThemeList()));
|
||||
});
|
||||
|
||||
// server.use(cookieParser());
|
||||
|
|
@ -110,7 +117,7 @@ server.get("/*", async (req, res) => {
|
|||
const promises: Promise<any>[] = [];
|
||||
|
||||
const headers = setForwardedHeaders(req.headers);
|
||||
const client = new LemmyHttp(httpBaseInternal, headers);
|
||||
const client = new LemmyHttp(getHttpBaseInternal(), headers);
|
||||
|
||||
// Get site data first
|
||||
// This bypasses errors, so that the client can hit the error on its own,
|
||||
|
|
@ -180,6 +187,23 @@ server.get("/*", async (req, res) => {
|
|||
|
||||
const config: ILemmyConfig = { wsHost: process.env.LEMMY_UI_LEMMY_WS_HOST };
|
||||
|
||||
const appleTouchIcon = site.site_view.site.icon
|
||||
? `data:image/png;base64,${sharp(
|
||||
await fetchIconPng(site.site_view.site.icon)
|
||||
)
|
||||
.resize(180, 180)
|
||||
.extend({
|
||||
bottom: 20,
|
||||
top: 20,
|
||||
left: 20,
|
||||
right: 20,
|
||||
background: "#222222",
|
||||
})
|
||||
.png()
|
||||
.toBuffer()
|
||||
.then(buf => buf.toString("base64"))}`
|
||||
: favIconPngUrl;
|
||||
|
||||
res.send(`
|
||||
<!DOCTYPE html>
|
||||
<html ${helmet.htmlAttributes.toString()} lang="en">
|
||||
|
|
@ -200,9 +224,19 @@ server.get("/*", async (req, res) => {
|
|||
<meta name="Description" content="Lemmy">
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<link
|
||||
id="favicon"
|
||||
rel="shortcut icon"
|
||||
type="image/x-icon"
|
||||
href=${site.site_view.site.icon ?? favIconUrl}
|
||||
/>
|
||||
|
||||
<!-- Web app manifest -->
|
||||
<link rel="manifest" href="/static/assets/manifest.webmanifest">
|
||||
<link rel="manifest" href="data:application/manifest+json;base64,${await generateManifestBase64(
|
||||
site.site_view.site
|
||||
)}">
|
||||
<link rel="apple-touch-icon" href=${appleTouchIcon} />
|
||||
<link rel="apple-touch-startup-image" href=${appleTouchIcon} />
|
||||
|
||||
<!-- Styles -->
|
||||
<link rel="stylesheet" type="text/css" href="/static/styles/styles.css" />
|
||||
|
|
@ -267,3 +301,63 @@ function removeParam(url: string, parameter: string): string {
|
|||
.replace(new RegExp("[?&]" + parameter + "=[^&#]*(#.*)?$"), "$1")
|
||||
.replace(new RegExp("([?&])" + parameter + "=[^&]*&"), "$1");
|
||||
}
|
||||
|
||||
const iconSizes = [72, 96, 128, 144, 152, 192, 384, 512];
|
||||
const defaultLogoPathDirectory = path.join(
|
||||
process.cwd(),
|
||||
"dist",
|
||||
"assets",
|
||||
"icons"
|
||||
);
|
||||
|
||||
export async function generateManifestBase64(site: Site) {
|
||||
const url = (
|
||||
process.env.NODE_ENV === "development"
|
||||
? "http://localhost:1236/"
|
||||
: getHttpBase()
|
||||
).replace(/\/$/g, "");
|
||||
const icon = site.icon ? await fetchIconPng(site.icon) : null;
|
||||
|
||||
const manifest = {
|
||||
name: site.name,
|
||||
description: site.description ?? "A link aggregator for the fediverse",
|
||||
start_url: url,
|
||||
scope: url,
|
||||
display: "standalone",
|
||||
id: "/",
|
||||
background_color: "#222222",
|
||||
theme_color: "#222222",
|
||||
icons: await Promise.all(
|
||||
iconSizes.map(async size => {
|
||||
let src = await readFile(
|
||||
path.join(defaultLogoPathDirectory, `icon-${size}x${size}.png`)
|
||||
).then(buf => buf.toString("base64"));
|
||||
|
||||
if (icon) {
|
||||
src = await sharp(icon)
|
||||
.resize(size, size)
|
||||
.png()
|
||||
.toBuffer()
|
||||
.then(buf => buf.toString("base64"));
|
||||
}
|
||||
|
||||
return {
|
||||
sizes: `${size}x${size}`,
|
||||
type: "image/png",
|
||||
src: `data:image/png;base64,${src}`,
|
||||
purpose: "any maskable",
|
||||
};
|
||||
})
|
||||
),
|
||||
};
|
||||
|
||||
return Buffer.from(JSON.stringify(manifest)).toString("base64");
|
||||
}
|
||||
|
||||
async function fetchIconPng(iconUrl: string) {
|
||||
return await fetch(
|
||||
iconUrl.replace(/https?:\/\/localhost:\d+/g, getHttpBaseInternal())
|
||||
)
|
||||
.then(res => res.blob())
|
||||
.then(blob => blob.arrayBuffer());
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,28 +0,0 @@
|
|||
import { register } from "register-service-worker";
|
||||
|
||||
register("/service-worker.js", {
|
||||
registrationOptions: { scope: "./" },
|
||||
ready() {
|
||||
console.log("Service worker is active.");
|
||||
},
|
||||
registered() {
|
||||
console.log("Service worker has been registered.");
|
||||
},
|
||||
cached() {
|
||||
console.log("Content has been cached for offline use.");
|
||||
},
|
||||
updatefound() {
|
||||
console.log("New content is downloading.");
|
||||
},
|
||||
updated() {
|
||||
console.log("New content is available; please refresh.");
|
||||
},
|
||||
offline() {
|
||||
console.log(
|
||||
"No internet connection found. App is running in offline mode."
|
||||
);
|
||||
},
|
||||
error(error) {
|
||||
console.error("Error during service worker registration:", error);
|
||||
},
|
||||
});
|
||||
|
|
@ -1,10 +1,9 @@
|
|||
import { Component } from "inferno";
|
||||
import { Helmet } from "inferno-helmet";
|
||||
import { Provider } from "inferno-i18next-dess";
|
||||
import { Route, Switch } from "inferno-router";
|
||||
import { i18n } from "../../i18next";
|
||||
import { routes } from "../../routes";
|
||||
import { favIconPngUrl, favIconUrl, setIsoData } from "../../utils";
|
||||
import { setIsoData } from "../../utils";
|
||||
import { Footer } from "./footer";
|
||||
import { Navbar } from "./navbar";
|
||||
import { NoMatch } from "./no-match";
|
||||
|
|
@ -19,24 +18,12 @@ export class App extends Component<any, any> {
|
|||
render() {
|
||||
let siteRes = this.isoData.site_res;
|
||||
let siteView = siteRes.site_view;
|
||||
let icon = siteView.site.icon;
|
||||
|
||||
return (
|
||||
<>
|
||||
<Provider i18next={i18n}>
|
||||
<div id="app">
|
||||
<Theme defaultTheme={siteView.local_site.default_theme} />
|
||||
{icon && (
|
||||
<Helmet>
|
||||
<link
|
||||
id="favicon"
|
||||
rel="shortcut icon"
|
||||
type="image/x-icon"
|
||||
href={icon || favIconUrl}
|
||||
/>
|
||||
<link rel="apple-touch-icon" href={icon || favIconPngUrl} />
|
||||
</Helmet>
|
||||
)}
|
||||
<Navbar siteRes={siteRes} />
|
||||
<div className="mt-4 p-0 fl-1">
|
||||
<Switch>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ import {
|
|||
SavePost,
|
||||
TransferCommunity,
|
||||
} from "lemmy-js-client";
|
||||
import { externalHost } from "../../env";
|
||||
import { getExternalHost } from "../../env";
|
||||
import { i18n } from "../../i18next";
|
||||
import { BanType, PostFormParams, PurgeType } from "../../interfaces";
|
||||
import { UserService, WebSocketService } from "../../services";
|
||||
|
|
@ -343,7 +343,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
|||
)}
|
||||
</li>
|
||||
<li className="list-inline-item">•</li>
|
||||
{url && !(hostname(url) == externalHost) && (
|
||||
{url && !(hostname(url) === getExternalHost()) && (
|
||||
<>
|
||||
<li className="list-inline-item">
|
||||
<a
|
||||
|
|
|
|||
|
|
@ -2,49 +2,69 @@ import { isBrowser } from "./utils";
|
|||
|
||||
const testHost = "0.0.0.0:8536";
|
||||
|
||||
let internalHost =
|
||||
(!isBrowser() && process.env.LEMMY_UI_LEMMY_INTERNAL_HOST) || testHost; // used for local dev
|
||||
export let externalHost: string;
|
||||
let host: string;
|
||||
let wsHost: string;
|
||||
let secure: string;
|
||||
|
||||
if (isBrowser()) {
|
||||
// browser
|
||||
const lemmyConfig =
|
||||
typeof window.lemmyConfig !== "undefined" ? window.lemmyConfig : {};
|
||||
|
||||
externalHost = `${window.location.hostname}${
|
||||
["1234", "1235"].includes(window.location.port)
|
||||
? ":8536"
|
||||
: window.location.port == ""
|
||||
? ""
|
||||
: `:${window.location.port}`
|
||||
}`;
|
||||
|
||||
host = externalHost;
|
||||
wsHost = lemmyConfig.wsHost || host;
|
||||
secure = window.location.protocol == "https:" ? "s" : "";
|
||||
} else {
|
||||
// server-side
|
||||
externalHost = process.env.LEMMY_UI_LEMMY_EXTERNAL_HOST || testHost;
|
||||
host = internalHost;
|
||||
wsHost = process.env.LEMMY_UI_LEMMY_WS_HOST || externalHost;
|
||||
secure = process.env.LEMMY_UI_HTTPS == "true" ? "s" : "";
|
||||
function getInternalHost() {
|
||||
return !isBrowser()
|
||||
? process.env.LEMMY_UI_LEMMY_INTERNAL_HOST ?? testHost
|
||||
: testHost; // used for local dev
|
||||
}
|
||||
|
||||
export const httpBaseInternal = `http://${host}`; // Don't use secure here
|
||||
export const httpBase = `http${secure}://${host}`;
|
||||
export const wsUriBase = `ws${secure}://${wsHost}`;
|
||||
export const wsUri = `${wsUriBase}/api/v3/ws`;
|
||||
export const isHttps = secure.endsWith("s");
|
||||
export function getExternalHost() {
|
||||
return isBrowser()
|
||||
? `${window.location.hostname}${
|
||||
["1234", "1235"].includes(window.location.port)
|
||||
? ":8536"
|
||||
: window.location.port == ""
|
||||
? ""
|
||||
: `:${window.location.port}`
|
||||
}`
|
||||
: process.env.LEMMY_UI_LEMMY_EXTERNAL_HOST || testHost;
|
||||
}
|
||||
|
||||
console.log(`httpbase: ${httpBase}`);
|
||||
console.log(`wsUri: ${wsUri}`);
|
||||
console.log(`isHttps: ${isHttps}`);
|
||||
function getSecure() {
|
||||
return (
|
||||
isBrowser()
|
||||
? window.location.protocol.includes("https")
|
||||
: process.env.LEMMY_UI_HTTPS === "true"
|
||||
)
|
||||
? "s"
|
||||
: "";
|
||||
}
|
||||
|
||||
function getHost() {
|
||||
return isBrowser() ? getExternalHost() : getInternalHost();
|
||||
}
|
||||
|
||||
function getWsHost() {
|
||||
return isBrowser()
|
||||
? window.lemmyConfig?.wsHost ?? getHost()
|
||||
: process.env.LEMMY_UI_LEMMY_WS_HOST ?? getExternalHost();
|
||||
}
|
||||
|
||||
function getBaseLocal(s = "") {
|
||||
return `http${s}://${getHost()}`;
|
||||
}
|
||||
|
||||
export function getHttpBaseInternal() {
|
||||
return getBaseLocal(); // Don't use secure here
|
||||
}
|
||||
export function getHttpBase() {
|
||||
return getBaseLocal(getSecure());
|
||||
}
|
||||
export function getWsUri() {
|
||||
return `ws${getSecure()}://${getWsHost()}/api/v3/ws`;
|
||||
}
|
||||
export function isHttps() {
|
||||
return getSecure() === "s";
|
||||
}
|
||||
|
||||
console.log(`httpbase: ${getHttpBase()}`);
|
||||
console.log(`wsUri: ${getWsUri()}`);
|
||||
console.log(`isHttps: ${isHttps()}`);
|
||||
|
||||
// This is for html tags, don't include port
|
||||
const httpExternalUri = `http${secure}://${externalHost.split(":")[0]}`;
|
||||
export function httpExternalPath(path: string) {
|
||||
return `${httpExternalUri}${path}`;
|
||||
return `http${getSecure()}://${getExternalHost().replace(
|
||||
/:\d+/g,
|
||||
""
|
||||
)}${path}`;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ export class UserService {
|
|||
expires.setDate(expires.getDate() + 365);
|
||||
if (res.jwt) {
|
||||
toast(i18n.t("logged_in"));
|
||||
IsomorphicCookie.save("jwt", res.jwt, { expires, secure: isHttps });
|
||||
IsomorphicCookie.save("jwt", res.jwt, { expires, secure: isHttps() });
|
||||
this.setJwtInfo();
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import {
|
|||
Websocket as WS,
|
||||
WebsocketBuilder,
|
||||
} from "websocket-ts";
|
||||
import { wsUri } from "../env";
|
||||
import { getWsUri } from "../env";
|
||||
import { isBrowser } from "../utils";
|
||||
|
||||
export class WebSocketService {
|
||||
|
|
@ -18,7 +18,7 @@ export class WebSocketService {
|
|||
let firstConnect = true;
|
||||
|
||||
this.subject = new Observable((obs: any) => {
|
||||
this.ws = new WebsocketBuilder(wsUri)
|
||||
this.ws = new WebsocketBuilder(getWsUri())
|
||||
.onMessage((_i, e) => {
|
||||
try {
|
||||
obs.next(JSON.parse(e.data.toString()));
|
||||
|
|
@ -27,7 +27,7 @@ export class WebSocketService {
|
|||
}
|
||||
})
|
||||
.onOpen(() => {
|
||||
console.log(`Connected to ${wsUri}`);
|
||||
console.log(`Connected to ${getWsUri()}`);
|
||||
|
||||
if (!firstConnect) {
|
||||
let res = {
|
||||
|
|
|
|||
|
|
@ -41,12 +41,12 @@ import { Subscription } from "rxjs";
|
|||
import { delay, retryWhen, take } from "rxjs/operators";
|
||||
import tippy from "tippy.js";
|
||||
import Toastify from "toastify-js";
|
||||
import { httpBase } from "./env";
|
||||
import { getHttpBase } from "./env";
|
||||
import { i18n, languages } from "./i18next";
|
||||
import { CommentNodeI, DataType, IsoData } from "./interfaces";
|
||||
import { UserService, WebSocketService } from "./services";
|
||||
|
||||
var Tribute: any;
|
||||
let Tribute: any;
|
||||
if (isBrowser()) {
|
||||
Tribute = require("tributejs");
|
||||
}
|
||||
|
|
@ -344,7 +344,7 @@ export function capitalizeFirstLetter(str: string): string {
|
|||
|
||||
export async function getSiteMetadata(url: string) {
|
||||
let form: GetSiteMetadata = { url };
|
||||
let client = new LemmyHttp(httpBase);
|
||||
let client = new LemmyHttp(getHttpBase());
|
||||
return client.getSiteMetadata(form);
|
||||
}
|
||||
|
||||
|
|
@ -1362,7 +1362,7 @@ export async function fetchCommunities(q: string) {
|
|||
limit: fetchLimit,
|
||||
auth: myAuth(false),
|
||||
};
|
||||
let client = new LemmyHttp(httpBase);
|
||||
let client = new LemmyHttp(getHttpBase());
|
||||
return client.search(form);
|
||||
}
|
||||
|
||||
|
|
@ -1376,7 +1376,7 @@ export async function fetchUsers(q: string) {
|
|||
limit: fetchLimit,
|
||||
auth: myAuth(false),
|
||||
};
|
||||
let client = new LemmyHttp(httpBase);
|
||||
let client = new LemmyHttp(getHttpBase());
|
||||
return client.search(form);
|
||||
}
|
||||
|
||||
|
|
@ -1540,7 +1540,7 @@ export function selectableLanguages(
|
|||
}
|
||||
|
||||
export function uploadImage(image: File): Promise<UploadImageResponse> {
|
||||
const client = new LemmyHttp(httpBase);
|
||||
const client = new LemmyHttp(getHttpBase());
|
||||
|
||||
return client.uploadImage({ image });
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,8 +3,8 @@ const MiniCssExtractPlugin = require("mini-css-extract-plugin");
|
|||
const nodeExternals = require("webpack-node-externals");
|
||||
const CopyPlugin = require("copy-webpack-plugin");
|
||||
const RunNodeWebpackPlugin = require("run-node-webpack-plugin");
|
||||
const { merge } = require("lodash");
|
||||
|
||||
const merge = require("lodash/merge");
|
||||
const { ServiceWorkerPlugin } = require("service-worker-webpack");
|
||||
const banner = `
|
||||
hash:[contentHash], chunkhash:[chunkhash], name:[name], filebase:[base], query:[query], file:[file]
|
||||
Source code: https://github.com/LemmyNet/lemmy-ui
|
||||
|
|
@ -83,6 +83,7 @@ const createServerConfig = (_env, mode) => {
|
|||
|
||||
return config;
|
||||
};
|
||||
|
||||
const createClientConfig = (_env, mode) => {
|
||||
const config = merge({}, base, {
|
||||
mode,
|
||||
|
|
@ -90,6 +91,58 @@ const createClientConfig = (_env, mode) => {
|
|||
output: {
|
||||
filename: "js/client.js",
|
||||
},
|
||||
plugins: [
|
||||
...base.plugins,
|
||||
new ServiceWorkerPlugin({
|
||||
enableInDevelopment: true,
|
||||
workbox: {
|
||||
modifyURLPrefix: {
|
||||
"/": "/static/",
|
||||
},
|
||||
cacheId: "lemmy",
|
||||
include: [/(assets|styles)\/.+\..+|client\.js$/g],
|
||||
inlineWorkboxRuntime: true,
|
||||
runtimeCaching: [
|
||||
{
|
||||
urlPattern: ({
|
||||
sameOrigin,
|
||||
url: { pathname, host },
|
||||
request: { method },
|
||||
}) =>
|
||||
(sameOrigin || host.includes("localhost")) &&
|
||||
(!(
|
||||
pathname.includes("pictrs") || pathname.includes("static")
|
||||
) ||
|
||||
method === "POST"),
|
||||
handler: "NetworkFirst",
|
||||
options: {
|
||||
cacheName: "instance-cache",
|
||||
},
|
||||
},
|
||||
{
|
||||
urlPattern: ({ url: { pathname, host }, sameOrigin }) =>
|
||||
(sameOrigin || host.includes("localhost")) &&
|
||||
pathname.includes("static"),
|
||||
handler: "CacheFirst",
|
||||
options: {
|
||||
cacheName: "static-cache",
|
||||
},
|
||||
},
|
||||
{
|
||||
urlPattern: ({ url: { pathname }, request: { method } }) =>
|
||||
pathname.includes("pictrs") && method === "GET",
|
||||
handler: "StaleWhileRevalidate",
|
||||
options: {
|
||||
cacheName: "image-cache",
|
||||
expiration: {
|
||||
maxAgeSeconds: 60 * 60 * 24,
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
}),
|
||||
],
|
||||
});
|
||||
|
||||
if (mode === "development") {
|
||||
|
|
|
|||
Loading…
Reference in a new issue