upgrade react to v19, migrate from CRA to Vite, add react compiler

.eslintrc.cjs

@@ -0,0 +1,8 @@
+module.exports = {
+  extends: ['react-app'],
+  rules: {
+    'no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': 'warn'
+  },
+  ignorePatterns: ['android/**', 'build/**', 'node_modules/**', 'public/**', 'electron/**']
+};

android/.idea/compiler.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="CompilerConfiguration">
+    <bytecodeTargetLevel target="21" />
+  </component>
+</project>

android/.idea/deploymentTargetSelector.xml

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="deploymentTargetSelector">
+    <selectionStates>
+      <SelectionState runConfigName="app">
+        <option name="selectionMode" value="DROPDOWN" />
+      </SelectionState>
+    </selectionStates>
+  </component>
+</project>

android/.idea/misc.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_21" default="true" project-jdk-name="jbr-21" project-jdk-type="JavaSDK" />
+</project>

android/.idea/runConfigurations.xml

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="RunConfigurationProducerService">
+    <option name="ignoredProducers">
+      <set>
+        <option value="com.intellij.execution.junit.AbstractAllInDirectoryConfigurationProducer" />
+        <option value="com.intellij.execution.junit.AllInPackageConfigurationProducer" />
+        <option value="com.intellij.execution.junit.TestInClassConfigurationProducer" />
+        <option value="com.intellij.execution.junit.UniqueIdConfigurationProducer" />
+      </set>
+    </option>
+  </component>
+</project>

android/gradle/wrapper/gradle-wrapper.properties

@@ -1,5 +1,7 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.6-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.9-bin.zip
+networkTimeout=10000
+validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists

android/gradlew

@@ -1,7 +1,7 @@
-#!/usr/bin/env sh
+#!/bin/sh
 
 #
-# Copyright 2015 the original author or authors.
+# Copyright © 2015-2021 the original authors.
 #
 # Licensed under the Apache License, Version 2.0 (the "License");
 # you may not use this file except in compliance with the License.
@@ -15,69 +15,104 @@
 # See the License for the specific language governing permissions and
 # limitations under the License.
 #
+# SPDX-License-Identifier: Apache-2.0
+#
 
 ##############################################################################
-##
+#
-##  Gradle start up script for UN*X
+#   Gradle start up script for POSIX generated by Gradle.
-##
+#
+#   Important for running:
+#
+#   (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
+#       noncompliant, but you have some other compliant shell such as ksh or
+#       bash, then to run this script, type that shell name before the whole
+#       command line, like:
+#
+#           ksh Gradle
+#
+#       Busybox and similar reduced shells will NOT work, because this script
+#       requires all of these POSIX shell features:
+#         * functions;
+#         * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
+#           «${var#prefix}», «${var%suffix}», and «$( cmd )»;
+#         * compound commands having a testable exit status, especially «case»;
+#         * various built-in commands including «command», «set», and «ulimit».
+#
+#   Important for patching:
+#
+#   (2) This script targets any POSIX shell, so it avoids extensions provided
+#       by Bash, Ksh, etc; in particular arrays are avoided.
+#
+#       The "traditional" practice of packing multiple parameters into a
+#       space-separated string is a well documented source of bugs and security
+#       problems, so this is (mostly) avoided, by progressively accumulating
+#       options in "$@", and eventually passing that to Java.
+#
+#       Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
+#       and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
+#       see the in-line comments for details.
+#
+#       There are tweaks for specific operating systems such as AIX, CygWin,
+#       Darwin, MinGW, and NonStop.
+#
+#   (3) This script is generated from the Groovy template
+#       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
+#       within the Gradle project.
+#
+#       You can find Gradle at https://github.com/gradle/gradle/.
+#
 ##############################################################################
 
 # Attempt to set APP_HOME
+
 # Resolve links: $0 may be a link
-PRG="$0"
+app_path=$0
-# Need this for relative symlinks.
+
-while [ -h "$PRG" ] ; do
+# Need this for daisy-chained symlinks.
-    ls=`ls -ld "$PRG"`
+while
-    link=`expr "$ls" : '.*-> \(.*\)$'`
+    APP_HOME=${app_path%"${app_path##*/}"}  # leaves a trailing /; empty if no leading path
-    if expr "$link" : '/.*' > /dev/null; then
+    [ -h "$app_path" ]
-        PRG="$link"
+do
-    else
+    ls=$( ls -ld "$app_path" )
-        PRG=`dirname "$PRG"`"/$link"
+    link=${ls#*' -> '}
-    fi
+    case $link in             #(
+      /*)   app_path=$link ;; #(
+      *)    app_path=$APP_HOME$link ;;
+    esac
 done
-SAVED="`pwd`"
-cd "`dirname \"$PRG\"`/" >/dev/null
-APP_HOME="`pwd -P`"
-cd "$SAVED" >/dev/null
 
-APP_NAME="Gradle"
+# This is normally unused
-APP_BASE_NAME=`basename "$0"`
+# shellcheck disable=SC2034
-
+APP_BASE_NAME=${0##*/}
-# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+# Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
-DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
+APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s
+' "$PWD" ) || exit
 
 # Use the maximum available, or set MAX_FD != -1 to use that value.
-MAX_FD="maximum"
+MAX_FD=maximum
 
 warn () {
     echo "$*"
-}
+} >&2
 
 die () {
     echo
     echo "$*"
     echo
     exit 1
-}
+} >&2
 
 # OS specific support (must be 'true' or 'false').
 cygwin=false
 msys=false
 darwin=false
 nonstop=false
-case "`uname`" in
+case "$( uname )" in                #(
-  CYGWIN* )
+  CYGWIN* )         cygwin=true  ;; #(
-    cygwin=true
+  Darwin* )         darwin=true  ;; #(
-    ;;
+  MSYS* | MINGW* )  msys=true    ;; #(
-  Darwin* )
+  NONSTOP* )        nonstop=true ;;
-    darwin=true
-    ;;
-  MINGW* )
-    msys=true
-    ;;
-  NONSTOP* )
-    nonstop=true
-    ;;
 esac
 
 CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
@@ -87,9 +122,9 @@ CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
 if [ -n "$JAVA_HOME" ] ; then
     if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
         # IBM's JDK on AIX uses strange locations for the executables
-        JAVACMD="$JAVA_HOME/jre/sh/java"
+        JAVACMD=$JAVA_HOME/jre/sh/java
     else
-        JAVACMD="$JAVA_HOME/bin/java"
+        JAVACMD=$JAVA_HOME/bin/java
     fi
     if [ ! -x "$JAVACMD" ] ; then
         die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
@@ -98,88 +133,120 @@ Please set the JAVA_HOME variable in your environment to match the
 location of your Java installation."
     fi
 else
-    JAVACMD="java"
+    JAVACMD=java
-    which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+    if ! command -v java >/dev/null 2>&1
+    then
+        die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
 
 Please set the JAVA_HOME variable in your environment to match the
 location of your Java installation."
+    fi
 fi
 
 # Increase the maximum file descriptors if we can.
-if [ "$cygwin" = "false" -a "$darwin" = "false" -a "$nonstop" = "false" ] ; then
+if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
-    MAX_FD_LIMIT=`ulimit -H -n`
+    case $MAX_FD in #(
-    if [ $? -eq 0 ] ; then
+      max*)
-        if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then
+        # In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.
-            MAX_FD="$MAX_FD_LIMIT"
+        # shellcheck disable=SC2039,SC3045
-        fi
+        MAX_FD=$( ulimit -H -n ) ||
-        ulimit -n $MAX_FD
+            warn "Could not query maximum file descriptor limit"
-        if [ $? -ne 0 ] ; then
+    esac
-            warn "Could not set maximum file descriptor limit: $MAX_FD"
+    case $MAX_FD in  #(
-        fi
+      '' | soft) :;; #(
-    else
+      *)
-        warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT"
+        # In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.
-    fi
+        # shellcheck disable=SC2039,SC3045
-fi
+        ulimit -n "$MAX_FD" ||
-
+            warn "Could not set maximum file descriptor limit to $MAX_FD"
-# For Darwin, add options to specify how the application appears in the dock
-if $darwin; then
-    GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\""
-fi
-
-# For Cygwin or MSYS, switch paths to Windows format before running java
-if [ "$cygwin" = "true" -o "$msys" = "true" ] ; then
-    APP_HOME=`cygpath --path --mixed "$APP_HOME"`
-    CLASSPATH=`cygpath --path --mixed "$CLASSPATH"`
-
-    JAVACMD=`cygpath --unix "$JAVACMD"`
-
-    # We build the pattern for arguments to be converted via cygpath
-    ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null`
-    SEP=""
-    for dir in $ROOTDIRSRAW ; do
-        ROOTDIRS="$ROOTDIRS$SEP$dir"
-        SEP="|"
-    done
-    OURCYGPATTERN="(^($ROOTDIRS))"
-    # Add a user-defined pattern to the cygpath arguments
-    if [ "$GRADLE_CYGPATTERN" != "" ] ; then
-        OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)"
-    fi
-    # Now convert the arguments - kludge to limit ourselves to /bin/sh
-    i=0
-    for arg in "$@" ; do
-        CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -`
-        CHECK2=`echo "$arg"|egrep -c "^-"`                                 ### Determine if an option
-
-        if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then                    ### Added a condition
-            eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"`
-        else
-            eval `echo args$i`="\"$arg\""
-        fi
-        i=`expr $i + 1`
-    done
-    case $i in
-        0) set -- ;;
-        1) set -- "$args0" ;;
-        2) set -- "$args0" "$args1" ;;
-        3) set -- "$args0" "$args1" "$args2" ;;
-        4) set -- "$args0" "$args1" "$args2" "$args3" ;;
-        5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;;
-        6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;;
-        7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;;
-        8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;;
-        9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;;
     esac
 fi
 
-# Escape application args
+# Collect all arguments for the java command, stacking in reverse order:
-save () {
+#   * args from the command line
-    for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done
+#   * the main class name
-    echo " "
+#   * -classpath
-}
+#   * -D...appname settings
-APP_ARGS=`save "$@"`
+#   * --module-path (only if needed)
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
 
-# Collect all arguments for the java command, following the shell quoting and substitution rules
+# For Cygwin or MSYS, switch paths to Windows format before running java
-eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS"
+if "$cygwin" || "$msys" ; then
+    APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
+    CLASSPATH=$( cygpath --path --mixed "$CLASSPATH" )
+
+    JAVACMD=$( cygpath --unix "$JAVACMD" )
+
+    # Now convert the arguments - kludge to limit ourselves to /bin/sh
+    for arg do
+        if
+            case $arg in                                #(
+              -*)   false ;;                            # don't mess with options #(
+              /?*)  t=${arg#/} t=/${t%%/*}              # looks like a POSIX filepath
+                    [ -e "$t" ] ;;                      #(
+              *)    false ;;
+            esac
+        then
+            arg=$( cygpath --path --ignore --mixed "$arg" )
+        fi
+        # Roll the args list around exactly as many times as the number of
+        # args, so each arg winds up back in the position where it started, but
+        # possibly modified.
+        #
+        # NB: a `for` loop captures its iteration list before it begins, so
+        # changing the positional parameters here affects neither the number of
+        # iterations, nor the values presented in `arg`.
+        shift                   # remove old arg
+        set -- "$@" "$arg"      # push replacement arg
+    done
+fi
+
+
+# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
+
+# Collect all arguments for the java command:
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,
+#     and any embedded shellness will be escaped.
+#   * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be
+#     treated as '${Hostname}' itself on the command line.
+
+set -- \
+        "-Dorg.gradle.appname=$APP_BASE_NAME" \
+        -classpath "$CLASSPATH" \
+        org.gradle.wrapper.GradleWrapperMain \
+        "$@"
+
+# Stop when "xargs" is not available.
+if ! command -v xargs >/dev/null 2>&1
+then
+    die "xargs is not available"
+fi
+
+# Use "xargs" to parse quoted args.
+#
+# With -n1 it outputs one arg per line, with the quotes and backslashes removed.
+#
+# In Bash we could simply go:
+#
+#   readarray ARGS < <( xargs -n1 <<<"$var" ) &&
+#   set -- "${ARGS[@]}" "$@"
+#
+# but POSIX shell has neither arrays nor command substitution, so instead we
+# post-process each arg (as a line of input to sed) to backslash-escape any
+# character that might be a shell metacharacter, then use eval to reverse
+# that process (while maintaining the separation between arguments), and wrap
+# the whole thing up as a single "set" statement.
+#
+# This will of course break if any of these variables contains a newline or
+# an unmatched quote.
+#
+
+eval "set -- $(
+        printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
+        xargs -n1 |
+        sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
+        tr '\n' ' '
+    )" '"$@"'
 
 exec "$JAVACMD" "$@"

android/gradlew.bat

@@ -13,8 +13,10 @@
 @rem See the License for the specific language governing permissions and
 @rem limitations under the License.
 @rem
+@rem SPDX-License-Identifier: Apache-2.0
+@rem
 
-@if "%DEBUG%" == "" @echo off
+@if "%DEBUG%"=="" @echo off
 @rem ##########################################################################
 @rem
 @rem  Gradle startup script for Windows
@@ -25,7 +27,8 @@
 if "%OS%"=="Windows_NT" setlocal
 
 set DIRNAME=%~dp0
-if "%DIRNAME%" == "" set DIRNAME=.
+if "%DIRNAME%"=="" set DIRNAME=.
+@rem This is normally unused
 set APP_BASE_NAME=%~n0
 set APP_HOME=%DIRNAME%
 
@@ -40,13 +43,13 @@ if defined JAVA_HOME goto findJavaFromJavaHome
 
 set JAVA_EXE=java.exe
 %JAVA_EXE% -version >NUL 2>&1
-if "%ERRORLEVEL%" == "0" goto execute
+if %ERRORLEVEL% equ 0 goto execute
 
-echo.
+echo. 1>&2
-echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 1>&2
-echo.
+echo. 1>&2
-echo Please set the JAVA_HOME variable in your environment to match the
+echo Please set the JAVA_HOME variable in your environment to match the 1>&2
-echo location of your Java installation.
+echo location of your Java installation. 1>&2
 
 goto fail
 
@@ -56,11 +59,11 @@ set JAVA_EXE=%JAVA_HOME%/bin/java.exe
 
 if exist "%JAVA_EXE%" goto execute
 
-echo.
+echo. 1>&2
-echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
+echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 1>&2
-echo.
+echo. 1>&2
-echo Please set the JAVA_HOME variable in your environment to match the
+echo Please set the JAVA_HOME variable in your environment to match the 1>&2
-echo location of your Java installation.
+echo location of your Java installation. 1>&2
 
 goto fail
 
@@ -75,13 +78,15 @@ set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
 
 :end
 @rem End local scope for the variables with windows NT shell
-if "%ERRORLEVEL%"=="0" goto mainEnd
+if %ERRORLEVEL% equ 0 goto mainEnd
 
 :fail
 rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
 rem the _cmd.exe /c_ return code!
-if  not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
+set EXIT_CODE=%ERRORLEVEL%
-exit /b 1
+if %EXIT_CODE% equ 0 set EXIT_CODE=1
+if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
+exit /b %EXIT_CODE%
 
 :mainEnd
 if "%OS%"=="Windows_NT" endlocal

electron/vite-config.js

@@ -0,0 +1,13 @@
+import { defineConfig } from 'vite';
+import path from 'path';
+
+export default defineConfig({
+  build: {
+    outDir: 'dist',
+    rollupOptions: {
+      input: {
+        main: path.resolve(__dirname, 'main.js'),
+      },
+    },
+  },
+});

index.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="referrer" content="no-referrer" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta name="description" content="serverless, adminless, decentralized 4chan alternative" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="/manifest.json" />
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+
+    <title>plebchan</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <script type="module" src="/src/index.tsx"></script>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>

package.json

@@ -22,6 +22,8 @@
     "electron-context-menu": "3.3.0",
     "electron-is-dev": "2.0.0",
     "ext-name": "5.0.0",
+    "fs-extra": "11.3.0",
+    "http-proxy": "1.18.1",
     "i18next": "23.5.1",
     "i18next-browser-languagedetector": "7.1.0",
     "i18next-http-backend": "2.2.2",
@@ -35,7 +37,6 @@
     "react-markdown": "8.0.6",
     "react-router-dom": "6.16.0",
     "react-router-hash-link": "2.4.3",
-    "react-scripts": "5.0.1",
     "react-virtuoso": "4.12.3",
     "rehype-sanitize": "5.0.1",
     "remark-gfm": "3.0.1",
@@ -45,12 +46,12 @@
     "zustand": "4.4.3"
   },
   "scripts": {
-    "start": "react-scripts start",
+    "start": "vite",
-    "build": "cross-env PUBLIC_URL=./ GENERATE_SOURCEMAP=false react-scripts build",
+    "build": "cross-env PUBLIC_URL=./ GENERATE_SOURCEMAP=false vite build",
-    "build-netlify": "cross-env PUBLIC_URL=./ GENERATE_SOURCEMAP=true REACT_APP_COMMIT_REF=$COMMIT_REF CI='' react-scripts build",
+    "build-netlify": "cross-env PUBLIC_URL=./ GENERATE_SOURCEMAP=true REACT_APP_COMMIT_REF=$COMMIT_REF CI='' vite build",
-    "test": "react-scripts test",
+    "test": "vitest",
-    "analyze-bundle": "cross-env PUBLIC_URL=./ GENERATE_SOURCEMAP=true react-scripts build && source-map-explorer 'build/static/js/*.js'",
+    "preview": "vite preview",
-    "eject": "react-scripts eject",
+    "analyze-bundle": "cross-env PUBLIC_URL=./ GENERATE_SOURCEMAP=true vite build && source-map-explorer 'build/assets/*.js'",
     "electron": "yarn electron:before && electron .",
     "electron:no-delete-data": "yarn electron:before:download-ipfs && electron .",
     "electron:start": "concurrently \"cross-env BROWSER=none yarn start\" \"wait-on http://localhost:3000 && yarn electron\"",
@@ -63,13 +64,8 @@
     "electron:before:delete-data": "rimraf .plebbit",
     "android:build:icons": "cordova-res android --skip-config --copy --resources /tmp/plebbit-react-android-icons --icon-source ./android/icons/icon.png --splash-source ./android/icons/splash.png --icon-foreground-source ./android/icons/icon-foreground.png --icon-background-source '#ffffee'",
     "prettier": "prettier {src,electron}/**/*.{js,ts,tsx} --write",
-    "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
+    "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0",
-  },
+    "android:build": "yarn build && npx cap sync android && npx cap open android"
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
   },
   "browserslist": {
     "production": [
@@ -90,16 +86,35 @@
     "@capacitor/cli": "5.0.0",
     "@capacitor/core": "5.0.0",
     "@types/memoizee": "0.4.9",
+    "@typescript-eslint/eslint-plugin": "8.26.0",
+    "@typescript-eslint/parser": "8.26.0",
+    "@vitejs/plugin-react": "4.3.4",
+    "assert": "2.1.0",
+    "babel-plugin-react-compiler": "19.0.0-beta-40c6c23-20250301",
+    "buffer": "6.0.3",
     "concurrently": "8.0.1",
     "conventional-changelog-cli": "4.1.0",
     "cordova-res": "0.15.4",
     "cross-env": "7.0.3",
+    "crypto-browserify": "3.12.1",
     "cz-conventional-changelog": "3.3.0",
     "decompress": "4.2.1",
     "electron": "28.2.3",
     "electron-builder": "24.13.2",
+    "electron-rebuild": "3.2.9",
+    "eslint": "8.56.0",
+    "eslint-config-react-app": "7.0.1",
+    "eslint-plugin-react": "7.37.4",
+    "eslint-plugin-react-compiler": "19.0.0-beta-40c6c23-20250301",
+    "eslint-plugin-react-hooks": "5.2.0",
     "husky": "4.3.8",
+    "isomorphic-fetch": "3.0.0",
     "lint-staged": "12.3.8",
+    "stream-browserify": "3.0.0",
+    "vite": "6.2.0",
+    "vite-plugin-eslint": "1.8.1",
+    "vite-plugin-node-polyfills": "0.23.0",
+    "vite-plugin-pwa": "0.21.1",
     "wait-on": "7.0.1"
   },
   "main": "electron/main.js",

public/index.html

@@ -1,72 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="referrer" content="no-referrer" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta name="description" content="serverless, adminless, decentralized 4chan alternative" />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/apple-touch-icon.png" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-
-    <!-- Preload assets -->
-    <link rel="preload" href="%PUBLIC_URL%/assets/background-fade-blue.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/background-fade.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/button-fade-blue.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/button-fade-dark.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/button-fade.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/cross-blue.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/cross-dark.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/cross-photon.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/cross-red.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/minus-blue.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/minus-dark.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/minus-photon.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/minus-red.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/plus-blue.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/plus-dark.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/plus-photon.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/plus-red.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/question-blue.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/question-dark.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/question-photon.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/buttons/question-red.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/filedeleted-res.gif" as="image" type="image/gif" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/icons/closed.gif" as="image" type="image/gif" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/icons/offline-blue.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/icons/offline-red.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/icons/sticky.gif" as="image" type="image/gif" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/logo/logo-transparent.png" as="image" type="image/png" />
-    <link rel="preload" href="%PUBLIC_URL%/assets/spoiler.png" as="image" type="image/png" />
-
-    <title>plebchan</title>
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-  </body>
-</html>

src/components/board-header/board-header.module.css

@@ -69,7 +69,7 @@
   border-image-width: 40px 0px 0px 0px;
   border-image-outset: 0px 0px 0px 0px;
   border-image-repeat: repeat repeat;
-  border-image-source: url('/public/assets/garland.png');
+  border-image-source: url('/assets/garland.png');
   border-style: solid;
   padding-top: 50px;
  }

src/components/catalog-row/catalog-row.module.css

@@ -58,11 +58,11 @@
 }
 
 .threadIcons .stickyIcon {
-  background-image: url("/public/assets/icons/sticky.gif");
+  background-image: url("/assets/icons/sticky.gif");
 }
 
 .threadIcons .closedIcon {
-  background-image: url("/public/assets/icons/closed.gif");
+  background-image: url("/assets/icons/closed.gif");
 }
 
 .mediaWrapper {

src/constants/nsfwTags.ts

@@ -0,0 +1,2 @@
+// plebchan shouldn't consider 'vulgar' or 'anti' as nsfw tags, unlike more sfw-oriented clients
+export const nsfwTags = ['adult', 'gore'];

src/hooks/use-initial-theme.ts

@@ -3,7 +3,7 @@ import { useLocation, useParams } from 'react-router-dom';
 import useThemeStore from '../stores/use-theme-store';
 import { useDefaultSubplebbits } from './use-default-subplebbits';
 import { isAllView, isHomeView, isNotFoundView, isPendingPostView, isSubscriptionsView } from '../lib/utils/view-utils';
-import { nsfwTags } from '../views/home/home';
+import { nsfwTags } from '../constants/nsfwTags';
 import { useAccountComment } from '@plebbit/plebbit-react-hooks';
 
 const useInitialTheme = (pendingPostSubplebbitAddress?: string) => {

src/hooks/use-theme.ts

@@ -4,7 +4,7 @@ import { isAllView, isSubscriptionsView } from '../lib/utils/view-utils';
 import useThemeStore from '../stores/use-theme-store';
 import { useDefaultSubplebbits } from './use-default-subplebbits';
 import useInitialTheme from './use-initial-theme';
-import { nsfwTags } from '../views/home/home';
+import { nsfwTags } from '../constants/nsfwTags';
 import { useAccountComment } from '@plebbit/plebbit-react-hooks';
 import useSpecialThemeStore from '../stores/use-special-theme-store';
 import { isChristmas } from '../lib/utils/time-utils';

src/index.css

@@ -53,11 +53,11 @@ hr {
 }
 
 .yellowOfflineIcon {
-  background-image: url('/public/assets/icons/offline-blue.png');
+  background-image: url('/assets/icons/offline-blue.png');
 }
 
 .redOfflineIcon {
-  background-image: url('/public/assets/icons/offline-red.png');
+  background-image: url('/assets/icons/offline-red.png');
 }
 
 @media (max-width: 640px) {

src/index.tsx

@@ -1,3 +1,4 @@
+import './polyfills.js';
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './app';

src/polyfills.js

@@ -0,0 +1,29 @@
+// Polyfills for Node.js built-ins
+import { Buffer } from 'buffer';
+import process from 'process';
+import 'isomorphic-fetch';
+
+window.Buffer = Buffer;
+window.process = process;
+window.global = window;
+
+// For ethers.js
+window.process.version = ''; // Fake Node.js version
+window.process.env = window.process.env || {};
+
+// Add any missing fetch polyfill
+if (!window.fetch) {
+  console.warn('Fetch API is not available, using polyfill');
+}
+
+// For crypto support
+if (typeof window.crypto === 'undefined') {
+  window.crypto = {};
+}
+if (typeof window.crypto.getRandomValues === 'undefined') {
+  window.crypto.getRandomValues = function (array) {
+    for (let i = 0; i < array.length; i++) {
+      array[i] = Math.floor(Math.random() * 256);
+    }
+  };
+}

src/themes.css

@@ -20,7 +20,7 @@
 
   /* body */
   --body-background-base-color: #ffe;
-  --body-background-pattern-image: url("/public/assets/background-fade.png");
+  --body-background-pattern-image: url("/assets/background-fade.png");
   --body-font-color: maroon;
   --body-font-family: arial, helvetica, sans-serif;
   --body-font-size: 10pt;
@@ -49,7 +49,7 @@
   /* desktop buttons */
   --button-desktop-text-color: #00e;
   --button-desktop-text-color-hover: red;
-  --close-button-background-image: url("/public/assets/buttons/cross-red.png");
+  --close-button-background-image: url("/assets/buttons/cross-red.png");
 
   /* horizontal rule */
   --hr-border: none;
@@ -90,7 +90,7 @@
   --button-font-size-mobile: 10pt;
   --button-font-weight-mobile: 700;
   --button-text-color-mobile: #800;
-  --button-background-image-mobile: url("/public/assets/buttons/button-fade.png");
+  --button-background-image-mobile: url("/assets/buttons/button-fade.png");
   --button-background-color-mobile: #f0e0d6;
   --button-border-mobile: 1px solid #c0a69d;
 
@@ -98,8 +98,8 @@
   --post-capcode-mod-text-color: purple;
 
   /* post desktop */
-  --post-hide-button-background-image: url("/public/assets/buttons/minus-red.png");
+  --post-hide-button-background-image: url("/assets/buttons/minus-red.png");
-  --post-unhide-button-background-image: url("/public/assets/buttons/plus-red.png");
+  --post-unhide-button-background-image: url("/assets/buttons/plus-red.png");
   --post-subject-text-color: #cc1105;
   --post-subject-font-weight: 700;
   --post-name-text-color: #117743;
@@ -190,9 +190,9 @@
   --settings-modal-border-right: 1px solid #d9bfb7;
   --settings-modal-border-bottom: 1px solid #d9bfb7;
   --settings-modal-border-left: none;
-  --settings-modal-close-button-background-image: url("/public/assets/buttons/cross-red.png");
+  --settings-modal-close-button-background-image: url("/assets/buttons/cross-red.png");
-  --settings-modal-show-button-background-image: url("/public/assets/buttons/plus-red.png");
+  --settings-modal-show-button-background-image: url("/assets/buttons/plus-red.png");
-  --settings-modal-hide-button-background-image: url("/public/assets/buttons/minus-red.png");
+  --settings-modal-hide-button-background-image: url("/assets/buttons/minus-red.png");
 
   /* stats */
   --stats-font-size: 11px;
@@ -234,7 +234,7 @@
 
   /* body */
   --body-background-base-color: #eef2ff;
-  --body-background-pattern-image: url("/public/assets/background-fade-blue.png");
+  --body-background-pattern-image: url("/assets/background-fade-blue.png");
   --body-font-color: #000;
   --body-font-family: arial, helvetica, sans-serif;
   --body-font-size: 10pt;
@@ -262,7 +262,7 @@
   /* desktop buttons */
   --button-desktop-text-color: #34345c;
   --button-desktop-text-color-hover: #d00;
-  --close-button-background-image: url("/public/assets/buttons/cross-blue.png");
+  --close-button-background-image: url("/assets/buttons/cross-blue.png");
 
   /* footer */
   --footer-item-background-color-desktop: #eef2ff;
@@ -302,7 +302,7 @@
   --button-font-size-mobile: 10pt;
   --button-font-weight-mobile: 700;
   --button-text-color-mobile: #34345c;
-  --button-background-image-mobile: url("/public/assets/buttons/button-fade-blue.png");
+  --button-background-image-mobile: url("/assets/buttons/button-fade-blue.png");
   --button-background-color-mobile: #d6daf0;
   --button-border-mobile: 1px solid #b7c5d9;
 
@@ -310,8 +310,8 @@
   --post-capcode-mod-text-color: purple;
 
   /* post desktop */
-  --post-hide-button-background-image: url("/public/assets/buttons/minus-blue.png");
+  --post-hide-button-background-image: url("/assets/buttons/minus-blue.png");
-  --post-unhide-button-background-image: url("/public/assets/buttons/plus-blue.png");
+  --post-unhide-button-background-image: url("/assets/buttons/plus-blue.png");
   --post-subject-text-color: #0f0c5d;
   --post-subject-font-weight: 700;
   --post-name-text-color: #117743;
@@ -402,9 +402,9 @@
   --settings-modal-border-bottom: 1px solid #b7c5d9;
   --settings-modal-border-left: none;
   --settings-modal-header-border-bottom: 1px solid #b7c5d9;
-  --settings-modal-close-button-background-image: url("/public/assets/buttons/cross-blue.png");
+  --settings-modal-close-button-background-image: url("/assets/buttons/cross-blue.png");
-  --settings-modal-show-button-background-image: url("/public/assets/buttons/plus-blue.png");
+  --settings-modal-show-button-background-image: url("/assets/buttons/plus-blue.png");
-  --settings-modal-hide-button-background-image: url("/public/assets/buttons/minus-blue.png");
+  --settings-modal-hide-button-background-image: url("/assets/buttons/minus-blue.png");
 
   /* stats */
   --stats-font-size: 11px;
@@ -478,7 +478,7 @@
   --button-desktop-text-color: #00e;
   --button-desktop-text-color-hover: red;
   --button-text-decoration: underline;
-  --close-button-background-image: url("/public/assets/buttons/cross-red.png");
+  --close-button-background-image: url("/assets/buttons/cross-red.png");
 
   /* footer */
   --footer-item-background-color-desktop: #fed;
@@ -498,7 +498,7 @@
   --button-font-size-mobile: 11pt;
   --button-font-weight-mobile: 700;
   --button-text-color-mobile: #800;
-  --button-background-image-mobile: url("/public/assets/buttons/button-fade.png");
+  --button-background-image-mobile: url("/assets/buttons/button-fade.png");
   --button-background-color-mobile: #f0e0d6;
   --button-border-mobile: 1px solid #c0a69d;
 
@@ -506,8 +506,8 @@
   --post-capcode-mod-text-color: purple;
 
   /* post desktop */
-  --post-hide-button-background-image: url("/public/assets/buttons/minus-red.png");
+  --post-hide-button-background-image: url("/assets/buttons/minus-red.png");
-  --post-unhide-button-background-image: url("/public/assets/buttons/plus-red.png");
+  --post-unhide-button-background-image: url("/assets/buttons/plus-red.png");
   --post-subject-text-color: #cc1105;
   --post-subject-font-weight: 700;
   --post-name-text-color: #117743;
@@ -583,9 +583,9 @@
   --settings-modal-border-bottom: 1px solid rgba(0, 0, 0, 0.20);
   --settings-modal-border-left: 1px solid rgba(0, 0, 0, 0.20);
   --settings-modal-header-border-bottom: 1px solid rgba(0,0,0,.2);
-  --settings-modal-close-button-background-image: url("/public/assets/buttons/cross-red.png");
+  --settings-modal-close-button-background-image: url("/assets/buttons/cross-red.png");
-  --settings-modal-show-button-background-image: url("/public/assets/buttons/plus-red.png");
+  --settings-modal-show-button-background-image: url("/assets/buttons/plus-red.png");
-  --settings-modal-hide-button-background-image: url("/public/assets/buttons/minus-red.png");
+  --settings-modal-hide-button-background-image: url("/assets/buttons/minus-red.png");
 
   /* stats */
   --stats-font-size: 10pt;
@@ -656,7 +656,7 @@
   --button-desktop-text-color: #34345c;
   --button-text-decoration: underline;
   --button-desktop-text-color-hover: #d00;
-  --close-button-background-image: url("/public/assets/buttons/cross-blue.png");
+  --close-button-background-image: url("/assets/buttons/cross-blue.png");
 
   /* footer */
   --footer-item-background-color-desktop: #eef2ff;
@@ -678,7 +678,7 @@
   --button-font-size-mobile: 11pt;
   --button-font-weight-mobile: 700;
   --button-text-color-mobile: #34345c;
-  --button-background-image-mobile: url("/public/assets/buttons/button-fade-blue.png");
+  --button-background-image-mobile: url("/assets/buttons/button-fade-blue.png");
   --button-background-color-mobile: #d6daf0;
   --button-border-mobile: 1px solid #b7c5d9;
 
@@ -694,8 +694,8 @@
   --post-capcode-mod-text-color: purple;
 
   /* post desktop */
-  --post-hide-button-background-image: url("/public/assets/buttons/minus-blue.png");
+  --post-hide-button-background-image: url("/assets/buttons/minus-blue.png");
-  --post-unhide-button-background-image: url("/public/assets/buttons/plus-blue.png");
+  --post-unhide-button-background-image: url("/assets/buttons/plus-blue.png");
   --post-subject-text-color: #0f0c5d;
   --post-subject-font-weight: 700;
   --post-name-text-color: #117743;
@@ -771,9 +771,9 @@
   --settings-modal-border-bottom: 1px solid rgba(0, 0, 0, 0.20);
   --settings-modal-border-left: 1px solid rgba(0, 0, 0, 0.20);
   --settings-modal-header-border-bottom: 1px solid rgba(0,0,0,.2);
-  --settings-modal-close-button-background-image: url("/public/assets/buttons/cross-blue.png");
+  --settings-modal-close-button-background-image: url("/assets/buttons/cross-blue.png");
-  --settings-modal-show-button-background-image: url("/public/assets/buttons/plus-blue.png");
+  --settings-modal-show-button-background-image: url("/assets/buttons/plus-blue.png");
-  --settings-modal-hide-button-background-image: url("/public/assets/buttons/minus-blue.png");
+  --settings-modal-hide-button-background-image: url("/assets/buttons/minus-blue.png");
 
   /* stats */
   --stats-font-size: 10pt;
@@ -847,7 +847,7 @@
   /* desktop buttons */
   --button-desktop-text-color: #81a2be;
   --button-desktop-text-color-hover: #5f89ac;
-  --close-button-background-image: url("/public/assets/buttons/cross-dark.png");
+  --close-button-background-image: url("/assets/buttons/cross-dark.png");
 
   /* filter for inputs */
   --filter80: brightness(85%);
@@ -882,7 +882,7 @@
   --button-font-size-mobile: 10pt;
   --button-font-weight-mobile: 700;
   --button-text-color-mobile: #707070;
-  --button-background-image-mobile: url("/public/assets/buttons/button-fade-dark.png");
+  --button-background-image-mobile: url("/assets/buttons/button-fade-dark.png");
   --button-background-color-mobile: #1b1c1e;
   --button-border-mobile: 1px solid #282a2e;
 
@@ -890,8 +890,8 @@
   --post-capcode-mod-text-color: #81a2be;
 
   /* post desktop */
-  --post-hide-button-background-image: url("/public/assets/buttons/minus-dark.png");
+  --post-hide-button-background-image: url("/assets/buttons/minus-dark.png");
-  --post-unhide-button-background-image: url("/public/assets/buttons/plus-dark.png");
+  --post-unhide-button-background-image: url("/assets/buttons/plus-dark.png");
   --post-subject-text-color: #b294bb;
   --post-subject-font-weight: 700;
   --post-name-text-color: #c5c8c6;
@@ -993,9 +993,9 @@
   --settings-modal-border-bottom: 1px solid #111;
   --settings-modal-border-left: 1px solid #111;
   --settings-modal-header-border-bottom: 1px solid #111;
-  --settings-modal-close-button-background-image: url("/public/assets/buttons/cross-dark.png");
+  --settings-modal-close-button-background-image: url("/assets/buttons/cross-dark.png");
-  --settings-modal-show-button-background-image: url("/public/assets/buttons/plus-dark.png");
+  --settings-modal-show-button-background-image: url("/assets/buttons/plus-dark.png");
-  --settings-modal-hide-button-background-image: url("/public/assets/buttons/minus-dark.png");
+  --settings-modal-hide-button-background-image: url("/assets/buttons/minus-dark.png");
 
   /* stats */
   --stats-font-size: 11px;
@@ -1066,7 +1066,7 @@
   /* desktop buttons */
   --button-desktop-text-color: #f60;
   --button-desktop-text-color-hover: #f30;
-  --close-button-background-image: url("/public/assets/buttons/cross-photon.png");
+  --close-button-background-image: url("/assets/buttons/cross-photon.png");
 
   /* horizontal rule */
   --hr-border: none;
@@ -1095,8 +1095,8 @@
   --post-capcode-mod-text-color: #f60;
 
   /* post desktop */
-  --post-hide-button-background-image: url("/public/assets/buttons/minus-photon.png");
+  --post-hide-button-background-image: url("/assets/buttons/minus-photon.png");
-  --post-unhide-button-background-image: url("/public/assets/buttons/plus-photon.png");
+  --post-unhide-button-background-image: url("/assets/buttons/plus-photon.png");
   --post-subject-text-color: #111;
   --post-subject-font-weight: 700;
   --post-name-text-color: #004a99;
@@ -1196,9 +1196,9 @@
   --settings-modal-border-bottom: 1px solid #ccc;
   --settings-modal-border-left: 1px solid #ccc;
   --settings-modal-header-border-bottom: 1px solid rgba(0, 0, 0, 0.20);
-  --settings-modal-close-button-background-image: url("/public/assets/buttons/cross-photon.png");
+  --settings-modal-close-button-background-image: url("/assets/buttons/cross-photon.png");
-  --settings-modal-show-button-background-image: url("/public/assets/buttons/plus-photon.png");
+  --settings-modal-show-button-background-image: url("/assets/buttons/plus-photon.png");
-  --settings-modal-hide-button-background-image: url("/public/assets/buttons/minus-photon.png");
+  --settings-modal-hide-button-background-image: url("/assets/buttons/minus-photon.png");
 
   /* stats */
   --stats-font-size: 11px;

src/views/board/board.module.css

@@ -45,7 +45,7 @@
   border-image-width: 40px 0px 0px 0px;
   border-image-outset: 0px 0px 0px 0px;
   border-image-repeat: repeat repeat;
-  border-image-source: url('/public/assets/garland.png');
+  border-image-source: url('/assets/garland.png');
   border-style: solid;
   padding-top: 50px;
 }

src/views/home/boards-list/boards-list.tsx

@@ -9,7 +9,7 @@ import useIsSubplebbitOffline from '../../../hooks/use-is-subplebbit-offline';
 import LoadingEllipsis from '../../../components/loading-ellipsis';
 import Tooltip from '../../../components/tooltip';
 import styles from './boards-list.module.css';
-import { nsfwTags } from '../home';
+import { nsfwTags } from '../../../constants/nsfwTags';
 
 const Board = ({ subplebbit, isMobile }: { subplebbit: Subplebbit; isMobile: boolean }) => {
   const { t } = useTranslation();

src/views/home/home.tsx

@@ -11,8 +11,6 @@ import Version from '../../components/version';
 import _ from 'lodash';
 
 // https://github.com/plebbit/temporary-default-subplebbits/blob/master/README.md
-// plebchan shouldn't consider 'vulgar' or 'anti' as nsfw tags, unlike more sfw-oriented clients
-export const nsfwTags = ['adult', 'gore'];
 
 const SearchBar = () => {
   const searchInputRef = useRef<HTMLInputElement>(null);

src/views/home/index.ts

@@ -1 +1 @@
-export { HomeLogo, Footer, nsfwTags, default } from './home';
+export { HomeLogo, Footer, default } from './home';

src/views/home/popular-threads-box/popular-threads-box.tsx

@@ -9,7 +9,7 @@ import { getCommentMediaInfo } from '../../../lib/utils/media-utils';
 import { CatalogPostMedia } from '../../../components/catalog-row';
 import LoadingEllipsis from '../../../components/loading-ellipsis';
 import BoxModal from '../box-modal';
-import { nsfwTags } from '../home';
+import { nsfwTags } from '../../../constants/nsfwTags';
 import { removeMarkdown } from '../../../lib/utils/post-utils';
 
 interface PopularThreadProps {

vite.config.js

@@ -0,0 +1,93 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import { resolve } from 'path';
+import { nodePolyfills } from 'vite-plugin-node-polyfills';
+import eslint from 'vite-plugin-eslint';
+
+export default defineConfig({
+  plugins: [
+    react({
+      babel: {
+        plugins: [
+          ['babel-plugin-react-compiler', { 
+            verbose: true 
+          }]
+        ]
+      }
+    }),
+    eslint({
+      lintOnStart: true,
+      overrideConfigFile: './.eslintrc.cjs',
+      failOnError: false,
+      failOnWarning: false,
+      cache: true,
+    }),
+    nodePolyfills({
+      globals: {
+        Buffer: true,
+        global: true,
+        process: true,
+      },
+      protocolImports: true,
+      include: ['crypto', 'stream', 'util', 'buffer', 'events'],
+    }),
+  ],
+  resolve: {
+    alias: {
+      '@': resolve(__dirname, 'src'),
+      'node-fetch': 'isomorphic-fetch',
+      'assert': 'assert',
+      'stream': 'stream-browserify',
+      'crypto': 'crypto-browserify',
+      'buffer': 'buffer',
+    }
+  },
+  server: {
+    port: 3000,
+    open: true,
+    watch: {
+      usePolling: true,
+    },
+    hmr: {
+      overlay: false
+    }
+  },
+  build: {
+    outDir: 'build',
+    emptyOutDir: true,
+    sourcemap: process.env.GENERATE_SOURCEMAP === 'true',
+    target: process.env.ELECTRON ? 'electron-renderer' : 'modules',
+    rollupOptions: {
+      output: {
+        manualChunks: {
+          vendor: ['react', 'react-dom', 'react-router-dom']
+        }
+      }
+    }
+  },
+  base: process.env.PUBLIC_URL || '/',
+  optimizeDeps: {
+    esbuildOptions: {
+      target: 'es2020',
+      define: {
+        global: 'globalThis',
+      },
+    },
+    include: [
+      'ethers',
+      'assert',
+      'buffer',
+      'process',
+      'stream-browserify',
+      'isomorphic-fetch'
+    ],
+  },
+  esbuild: {
+    target: 'es2020'
+  },
+  define: {
+    'process.env': {},
+    'global': 'globalThis',
+    '__dirname': '""',
+  }
+});