External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor: implement scalable asset manifest system for dynamic images

Browse Source 
Created build-time script to generate TypeScript manifest from public/assets, avoiding import.meta.glob limitations. Images stay in public/ for scalability (supports hundreds), while components get type-safe auto-discovery. Manifest auto-regenerates before builds.
This commit is contained in:
plebeius
2025-11-01 19:39:22 +01:00
parent 967584294c
commit f26da13c77
6 changed files with 83 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/not-found/not-found.tsx
+2 -18
View File
@@ -3,26 +3,10 @@ import { Link, useLocation } from 'react-router-dom';
import useSubplebbitsStore from '@plebbit/plebbit-react-hooks/dist/stores/subplebbits';
import { HomeLogo } from '../home';
import styles from './not-found.module.css';
// Dynamically import all not-found images at build time
const notFoundModules = import.meta.glob('/public/assets/not-found/not-found-*.{jpg,jpeg,gif,png}', {
eager: true,
query: '?url',
import: 'default',
});
const notFoundPaths = Object.values(notFoundModules) as string[];
import { NOT_FOUND_IMAGES } from '../../generated/asset-manifest';
const NotFoundImage = () => {
const [imagePath] = useState(() => {
if (notFoundPaths.length === 0) {
return null;
}
return notFoundPaths[Math.floor(Math.random() * notFoundPaths.length)];
});
if (!imagePath) {
return null;
}
const [imagePath] = useState(() => NOT_FOUND_IMAGES[Math.floor(Math.random() * NOT_FOUND_IMAGES.length)]);
return <img src={imagePath} alt='' />;
};