Merge remote-tracking branch 'origin/main' into fix_security_link

.eslintignore

@@ -5,3 +5,4 @@ src/api_tests
 **/*.css
 **/*.scss
 **/*.svg
+src/shared/translations/**

lemmy-translations

@@ -1 +1 @@
-Subproject commit 6fe83fe9c0bfdf8bcee6e2528e4420fabd582b8b
+Subproject commit c3e61706e2ff7977db83e964e3010f72cad5e408

package.json

@@ -1,97 +1,88 @@
 {
   "name": "lemmy-ui",
-  "version": "0.19.2",
   "description": "An isomorphic UI for lemmy",
-  "repository": "https://github.com/LemmyNet/lemmy-ui",
+  "version": "0.19.3",
-  "license": "AGPL-3.0",
   "author": "Dessalines <tyhou13@gmx.com>",
+  "license": "AGPL-3.0",
   "scripts": {
     "analyze": "webpack --mode=none",
-    "prebuild:dev": "yarn clean && node generate_translations.js",
     "build:dev": "webpack --env COMMIT_HASH=$(git rev-parse --short HEAD) --mode=development",
-    "prebuild:prod": "yarn clean && node generate_translations.js",
     "build:prod": "webpack --env COMMIT_HASH=$(git rev-parse --short HEAD) --mode=production",
     "clean": "yarn run rimraf dist",
     "dev": "yarn build:dev --watch",
     "lint": "yarn translations:generate && tsc --noEmit && eslint --report-unused-disable-directives --ext .js,.ts,.tsx \"src/**\" && prettier --check \"src/**/*.{ts,tsx,js,css,scss}\"",
-    "prepare": "husky install",
     "postinstall": "husky install",
+    "prebuild:dev": "yarn clean && node generate_translations.js",
+    "prebuild:prod": "yarn clean && node generate_translations.js",
+    "prepare": "husky install",
     "themes:build": "sass src/assets/css/themes/:src/assets/css/themes",
     "themes:watch": "sass --watch src/assets/css/themes/:src/assets/css/themes",
     "translations:generate": "node generate_translations.js",
     "translations:init": "git submodule init && yarn translations:update",
     "translations:update": "git submodule update --remote --recursive"
   },
-  "lint-staged": {
+  "repository": "https://github.com/LemmyNet/lemmy-ui",
-    "*.{ts,tsx,js}": [
+  "engines": {
-      "prettier --write",
+    "node": ">=8.9.0"
-      "eslint --fix"
-    ],
-    "*.{css, scss}": [
-      "prettier --write"
-    ],
-    "package.json": [
-      "sortpack"
-    ]
   },
   "dependencies": {
     "@babel/plugin-proposal-class-properties": "^7.18.6",
-    "@babel/plugin-proposal-decorators": "^7.21.5",
+    "@babel/plugin-proposal-decorators": "^7.23.7",
-    "@babel/plugin-transform-runtime": "^7.21.5",
+    "@babel/plugin-transform-runtime": "^7.23.7",
-    "@babel/plugin-transform-typescript": "^7.21.5",
+    "@babel/plugin-transform-typescript": "^7.23.6",
-    "@babel/preset-env": "^7.23.3",
+    "@babel/preset-env": "^7.23.8",
     "@babel/preset-typescript": "^7.21.5",
-    "@babel/runtime": "^7.21.5",
+    "@babel/runtime": "^7.23.8",
     "@emoji-mart/data": "^1.1.0",
     "@shortcm/qr-image": "^9.0.2",
     "autosize": "^6.0.1",
     "babel-loader": "^9.1.3",
-    "babel-plugin-inferno": "^6.6.0",
+    "babel-plugin-inferno": "^6.7.1",
     "bootstrap": "^5.3.1",
     "check-password-strength": "^2.0.7",
-    "classnames": "^2.3.1",
+    "classnames": "^2.5.1",
     "clean-webpack-plugin": "^4.0.0",
     "cookie": "^0.6.0",
-    "copy-webpack-plugin": "^11.0.0",
+    "copy-webpack-plugin": "^12.0.2",
-    "css-loader": "^6.7.3",
+    "css-loader": "^6.9.1",
-    "date-fns": "^2.30.0",
+    "date-fns": "^3.2.0",
     "emoji-mart": "^5.4.0",
     "emoji-short-name": "^2.0.0",
     "express": "~4.18.2",
     "history": "^5.3.0",
     "html-to-text": "^9.0.5",
     "husky": "^8.0.3",
-    "i18next": "^23.3.0",
+    "i18next": "^23.7.16",
-    "inferno": "^8.2.2",
+    "inferno": "^8.2.3",
-    "inferno-create-element": "^8.2.2",
+    "inferno-create-element": "^8.2.3",
     "inferno-helmet": "^5.2.1",
-    "inferno-hydrate": "^8.2.2",
+    "inferno-hydrate": "^8.2.3",
     "inferno-i18next-dess": "0.0.2",
-    "inferno-router": "^8.2.2",
+    "inferno-router": "^8.2.3",
-    "inferno-server": "^8.2.2",
+    "inferno-server": "^8.2.3",
     "jwt-decode": "^4.0.0",
     "lemmy-js-client": "0.19.2-alpha.1",
     "lodash.isequal": "^4.5.0",
-    "markdown-it": "^13.0.1",
+    "markdown-it": "^14.0.0",
     "markdown-it-bidi": "^0.1.0",
-    "markdown-it-container": "^3.0.0",
+    "markdown-it-container": "^4.0.0",
-    "markdown-it-emoji": "^2.0.2",
+    "markdown-it-emoji": "^3.0.0",
-    "markdown-it-footnote": "^3.0.3",
+    "markdown-it-footnote": "^4.0.0",
     "markdown-it-highlightjs": "^4.0.1",
     "markdown-it-html5-embed": "^1.0.0",
     "markdown-it-ruby": "^0.1.1",
-    "markdown-it-sub": "^1.0.0",
+    "markdown-it-sub": "^2.0.0",
-    "markdown-it-sup": "^1.0.0",
+    "markdown-it-sup": "^2.0.0",
-    "mini-css-extract-plugin": "^2.7.5",
+    "mini-css-extract-plugin": "^2.7.7",
     "register-service-worker": "^1.7.2",
     "run-node-webpack-plugin": "^1.3.0",
     "rxjs": "^7.8.1",
     "sanitize-html": "^2.11.0",
-    "sass": "^1.64.1",
+    "sass": "^1.70.0",
-    "sass-loader": "^13.3.2",
+    "sass-loader": "^14.0.0",
-    "serialize-javascript": "^6.0.1",
+    "serialize-javascript": "^6.0.2",
     "service-worker-webpack": "^1.0.0",
-    "sharp": "^0.32.6",
+    "sharp": "0.32.6",
     "tippy.js": "^6.3.7",
     "toastify-js": "^1.12.0",
     "tributejs": "^5.1.3",
@@ -100,7 +91,7 @@
     "webpack-node-externals": "^3.0.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.23.3",
+    "@babel/core": "^7.23.7",
     "@types/autosize": "^4.0.0",
     "@types/bootstrap": "^5.2.6",
     "@types/cookie": "^0.6.0",
@@ -109,36 +100,45 @@
     "@types/lodash.isequal": "^4.5.6",
     "@types/markdown-it": "^13.0.7",
     "@types/markdown-it-container": "^2.0.6",
-    "@types/node": "^20.10.0",
+    "@types/node": "^20.11.5",
     "@types/path-browserify": "^1.0.0",
     "@types/sanitize-html": "^2.9.0",
     "@types/serialize-javascript": "^5.0.1",
     "@types/toastify-js": "^1.12.0",
-    "@typescript-eslint/eslint-plugin": "^6.2.0",
+    "@typescript-eslint/eslint-plugin": "^6.19.0",
-    "@typescript-eslint/parser": "^6.2.0",
+    "@typescript-eslint/parser": "^6.19.0",
-    "eslint": "^8.45.0",
+    "eslint": "^8.56.0",
-    "eslint-plugin-inferno": "^7.32.2",
+    "eslint-plugin-inferno": "^7.33.3",
     "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-prettier": "^5.0.0",
+    "eslint-plugin-prettier": "^5.1.3",
     "import-sort-style-module": "^6.0.0",
-    "lint-staged": "^15.1.0",
+    "lint-staged": "^15.2.0",
-    "prettier": "^3.0.0",
+    "prettier": "^3.2.4",
     "prettier-plugin-import-sort": "^0.0.7",
     "prettier-plugin-organize-imports": "^3.2.3",
-    "prettier-plugin-packagejson": "^2.4.5",
+    "prettier-plugin-packagejson": "^2.4.9",
     "rimraf": "^5.0.0",
-    "sortpack": "^2.3.4",
+    "sortpack": "^2.4.0",
-    "style-loader": "^3.3.2",
+    "style-loader": "^3.3.4",
-    "terser": "^5.19.2",
+    "terser": "^5.27.0",
-    "typescript": "^5.1.6",
+    "typescript": "^5.3.3",
-    "typescript-language-server": "^4.1.2",
+    "typescript-language-server": "^4.3.1",
     "webpack-bundle-analyzer": "^4.9.0",
     "webpack-dev-server": "4.15.1"
   },
-  "packageManager": "yarn@1.22.19",
+  "lint-staged": {
-  "engines": {
+    "*.{css, scss}": [
-    "node": ">=8.9.0"
+      "prettier --write"
+    ],
+    "*.{ts,tsx,js}": [
+      "prettier --write",
+      "eslint --fix"
+    ],
+    "package.json": [
+      "sortpack"
+    ]
   },
+  "packageManager": "yarn@1.22.19",
   "engineStrict": true,
   "importSort": {
     ".js, .jsx, .ts, .tsx": {

src/shared/components/comment/comment-node.tsx

@@ -1,9 +1,7 @@
 import { colorList, getCommentParentId, showScores } from "@utils/app";
 import { futureDaysToUnixTime, numToSI } from "@utils/helpers";
 import classNames from "classnames";
-import isBefore from "date-fns/isBefore";
+import { isBefore, parseISO, subMinutes } from "date-fns";
-import parseISO from "date-fns/parseISO";
-import subMinutes from "date-fns/subMinutes";
 import { Component, InfernoNode, linkEvent } from "inferno";
 import { Link } from "inferno-router";
 import {

src/shared/components/common/moment-time.tsx

@@ -1,6 +1,5 @@
 import { capitalizeFirstLetter, formatPastDate } from "@utils/helpers";
-import { format } from "date-fns";
+import { format, parseISO } from "date-fns";
-import parseISO from "date-fns/parseISO";
 import { Component } from "inferno";
 import { I18NextService } from "../../services";
 import { Icon } from "./icon";

src/shared/components/community/community.tsx

@@ -95,12 +95,12 @@ import { DataTypeSelect } from "../common/data-type-select";
 import { HtmlTags } from "../common/html-tags";
 import { Icon, Spinner } from "../common/icon";
 import { SortSelect } from "../common/sort-select";
-import { Sidebar } from "../community/sidebar";
 import { SiteSidebar } from "../home/site-sidebar";
 import { PostListings } from "../post/post-listings";
 import { CommunityLink } from "./community-link";
 import { PaginatorCursor } from "../common/paginator-cursor";
 import { getHttpBaseInternal } from "../../utils/env";
+import { Sidebar } from "./sidebar";
 
 type CommunityData = RouteDataResponse<{
   communityRes: GetCommunityResponse;
@@ -503,7 +503,21 @@ export class Community extends Component<
       community && (
         <div className="mb-2">
           <BannerIconHeader banner={community.banner} icon={community.icon} />
-          <h1 className="h4 mb-0 overflow-wrap-anywhere">{community.title}</h1>
+          <div>
+            <h1
+              className="h4 mb-0 overflow-wrap-anywhere d-inline"
+              data-tippy-content={
+                community.posting_restricted_to_mods
+                  ? I18NextService.i18n.t("community_locked")
+                  : ""
+              }
+            >
+              {community.title}
+            </h1>
+            {community.posting_restricted_to_mods && (
+              <Icon icon="lock" inline classes="text-danger fs-4 ms-2" />
+            )}
+          </div>
           <CommunityLink
             community={community}
             realLink

src/shared/components/community/sidebar.tsx

@@ -122,9 +122,10 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
   }
 
   sidebar() {
-    const myUSerInfo = UserService.Instance.myUserInfo;
+    const myUserInfo = UserService.Instance.myUserInfo;
     const {
-      community: { name, actor_id },
+      community: { name, actor_id, id, posting_restricted_to_mods },
+      counts,
     } = this.props.community_view;
     return (
       <aside className="mb-3">
@@ -140,8 +141,8 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
                 loading={this.state.followCommunityLoading}
               />
               {this.canPost && this.createPost()}
-              {myUSerInfo && this.blockCommunity()}
+              {myUserInfo && this.blockCommunity()}
-              {!myUSerInfo && (
+              {!myUserInfo && (
                 <div className="alert alert-info" role="alert">
                   <T
                     i18nKey="community_not_logged_in_alert"
@@ -158,11 +159,23 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
           </section>
           <section id="sidebarInfo" className="card border-secondary mb-3">
             <div className="card-body">
+              {posting_restricted_to_mods && (
+                <div
+                  className="alert alert-warning text-sm-start text-xs-center"
+                  role="alert"
+                >
+                  <Icon
+                    icon="lock"
+                    inline
+                    classes="me-sm-2 mx-auto d-sm-inline d-block"
+                  />
+                  <T i18nKey="community_locked_message" className="d-inline">
+                    #<strong className="fw-bold">#</strong>#
+                  </T>
+                </div>
+              )}
               {this.description()}
-              <Badges
+              <Badges communityId={id} counts={counts} />
-                communityId={this.props.community_view.community.id}
-                counts={this.props.community_view.counts}
-              />
               {this.mods()}
             </div>
           </section>

src/shared/components/home/home.tsx

@@ -291,8 +291,9 @@ export class Home extends Component<any, HomeState> {
       };
     }
 
-    this.state.tagline = getRandomFromList(this.state?.siteRes?.taglines ?? [])
+    this.state.tagline = getRandomFromList(
-      ?.content;
+      this.state?.siteRes?.taglines ?? [],
+    )?.content;
   }
 
   async componentDidMount() {

src/shared/components/home/signup.tsx

@@ -71,13 +71,9 @@ export class Signup extends Component<any, State> {
 
   async fetchCaptcha() {
     this.setState({ captchaRes: LOADING_REQUEST });
-    HttpService.client.setHeaders({
-      "Cache-Control": "private, no-cache",
-    });
     this.setState({
       captchaRes: await HttpService.client.getCaptcha(),
     });
-    HttpService.client.setHeaders({});
 
     this.setState(s => {
       if (s.captchaRes.state === "success") {

src/shared/components/person/profile.tsx

@@ -22,8 +22,7 @@ import { canMod, isBanned } from "@utils/roles";
 import type { QueryParams } from "@utils/types";
 import { RouteDataResponse } from "@utils/types";
 import classNames from "classnames";
-import format from "date-fns/format";
+import { format, parseISO } from "date-fns";
-import parseISO from "date-fns/parseISO";
 import { NoOptionI18nKeys } from "i18next";
 import { Component, linkEvent } from "inferno";
 import { Link } from "inferno-router";

src/shared/markdown.ts

@@ -346,8 +346,9 @@ export function setupTribute() {
           return `${item.original.val} ${shortName}`;
         },
         selectTemplate: (item: any) => {
-          const customEmoji = customEmojisLookup.get(item.original.key)
+          const customEmoji = customEmojisLookup.get(
-            ?.custom_emoji;
+            item.original.key,
+          )?.custom_emoji;
           if (customEmoji === undefined) return `${item.original.val}`;
           else
             return `![${customEmoji.alt_text}](${customEmoji.image_url} "emoji ${customEmoji.shortcode}")`;

src/shared/utils/app/setup-date-fns.ts

@@ -1,4 +1,4 @@
-import setDefaultOptions from "date-fns/setDefaultOptions";
+import { setDefaultOptions } from "date-fns";
 import { I18NextService } from "../../services";
 
 const EN_US = "en-US";
@@ -25,9 +25,9 @@ export default async function () {
     locale = (
       await import(
         /* webpackExclude: /\.js\.flow$/ */
-        `date-fns/locale/${lang}`
+        `date-fns/locale`
       )
-    ).default;
+    )[lang];
   } catch (e) {
     console.log(
       `Could not load locale ${lang} from date-fns, falling back to ${EN_US}`,
@@ -35,9 +35,9 @@ export default async function () {
     locale = (
       await import(
         /* webpackExclude: /\.js\.flow$/ */
-        `date-fns/locale/${EN_US}`
+        `date-fns/locale`
       )
-    ).default;
+    )[EN_US];
   }
   setDefaultOptions({
     locale,

src/shared/utils/helpers/format-past-date.ts

@@ -1,5 +1,4 @@
-import formatDistanceStrict from "date-fns/formatDistanceStrict";
+import { parseISO, formatDistanceStrict } from "date-fns";
-import parseISO from "date-fns/parseISO";
 
 export default function (dateString?: string) {
   const parsed = parseISO((dateString ?? Date.now().toString()) + "Z");

src/shared/utils/helpers/is-cake-day.ts

@@ -1,6 +1,4 @@
-import getDayOfYear from "date-fns/getDayOfYear";
+import { parseISO, getYear, getDayOfYear } from "date-fns";
-import getYear from "date-fns/getYear";
-import parseISO from "date-fns/parseISO";
 
 export default function isCakeDay(published: string): boolean {
   const createDate = parseISO(published);