diff --git a/src/App.js b/src/App.js
index e4c825ec..40a8b936 100755
--- a/src/App.js
+++ b/src/App.js
@@ -28,209 +28,162 @@ import packageJson from '../package.json';
const commitRef = process?.env?.REACT_APP_COMMIT_REF || '';
export default function App() {
- const {
- bodyStyle,
- setBodyStyle,
- setDefaultSubplebbits,
- isCaptchaOpen,
- setIsCaptchaOpen,
- setIsSettingsOpen,
- selectedStyle,
- setSelectedStyle,
- setShowPostForm,
- setShowPostFormLink,
- } = useGeneralStore((state) => state);
+ const { bodyStyle, setBodyStyle, setDefaultSubplebbits, isCaptchaOpen, setIsCaptchaOpen, setIsSettingsOpen, selectedStyle, setShowPostForm, setShowPostFormLink } =
+ useGeneralStore((state) => state);
- const location = useLocation();
- const isHomeRoute = location.pathname === '/';
- const isElectron = window.electron && window.electron.isElectron;
+ const location = useLocation();
+ const isElectron = window.electron && window.electron.isElectron;
- const [, setNewErrorMessage] = useError();
- const [, setNewSuccessMessage] = useSuccess();
- const [, setNewInfoMessage] = useInfo();
+ const [, setNewErrorMessage] = useError();
+ const [, setNewSuccessMessage] = useSuccess();
+ const [, setNewInfoMessage] = useInfo();
- const [infoMessageShown, setInfoMessageShown] = useState(false);
+ const [infoMessageShown, setInfoMessageShown] = useState(false);
- useEffect(() => {
- const successToast = localStorage.getItem('successToast');
- const errorToast = localStorage.getItem('errorToast');
- if (successToast) {
- setNewSuccessMessage(successToast);
- localStorage.removeItem('successToast');
- } else if (errorToast) {
- setNewErrorMessage(errorToast);
- localStorage.removeItem('errorToast');
- } else {
- return;
- }
- }, [setNewErrorMessage, setNewSuccessMessage]);
+ useEffect(() => {
+ const successToast = localStorage.getItem('successToast');
+ const errorToast = localStorage.getItem('errorToast');
+ if (successToast) {
+ setNewSuccessMessage(successToast);
+ localStorage.removeItem('successToast');
+ } else if (errorToast) {
+ setNewErrorMessage(errorToast);
+ localStorage.removeItem('errorToast');
+ } else {
+ return;
+ }
+ }, [setNewErrorMessage, setNewSuccessMessage]);
- // check for new version
- // TODO: delete this code and toast when v1.0.0 is released
- useEffect(() => {
- const fetchVersionInfo = async () => {
- try {
- const packageRes = await fetch('https://raw.githubusercontent.com/plebbit/plebchan/master/package.json', { cache: 'no-cache' });
- const packageData = await packageRes.json();
+ // check for new version
+ // TODO: delete this code and toast when v1.0.0 is released
+ useEffect(() => {
+ const fetchVersionInfo = async () => {
+ try {
+ const packageRes = await fetch('https://raw.githubusercontent.com/plebbit/plebchan/master/package.json', { cache: 'no-cache' });
+ const packageData = await packageRes.json();
- if (packageJson.version !== packageData.version && !infoMessageShown) {
- const newVersionInfo = isElectron
- ? `New version available, plebchan v${packageData.version}. You are using v${packageJson.version}. Download the latest version here: https://github.com/plebbit/plebchan/releases/latest`
- : `New version available, plebchan v${packageData.version}. You are using v${packageJson.version}. Refresh to update.`;
- setNewInfoMessage(newVersionInfo);
- setInfoMessageShown(true);
- }
+ if (packageJson.version !== packageData.version && !infoMessageShown) {
+ const newVersionInfo = isElectron
+ ? `New version available, plebchan v${packageData.version}. You are using v${packageJson.version}. Download the latest version here: https://github.com/plebbit/plebchan/releases/latest`
+ : `New version available, plebchan v${packageData.version}. You are using v${packageJson.version}. Refresh to update.`;
+ setNewInfoMessage(newVersionInfo);
+ setInfoMessageShown(true);
+ }
- if (commitRef.length > 0) {
- const commitRes = await fetch('https://api.github.com/repos/plebbit/plebchan/commits?per_page=1&sha=development', { cache: 'no-cache' });
- const commitData = await commitRes.json();
+ if (commitRef.length > 0) {
+ const commitRes = await fetch('https://api.github.com/repos/plebbit/plebchan/commits?per_page=1&sha=development', { cache: 'no-cache' });
+ const commitData = await commitRes.json();
- const latestCommitHash = commitData[0].sha;
+ const latestCommitHash = commitData[0].sha;
- if (latestCommitHash.trim() !== commitRef.trim() && !infoMessageShown) {
- const newVersionInfo = `New dev version available, commit ${latestCommitHash.slice(0, 7)}. You are using commit ${commitRef.slice(0, 7)}. Refresh to update.`;
- setNewInfoMessage(newVersionInfo);
- setInfoMessageShown(true);
- }
- }
- } catch (error) {
- console.error('Failed to fetch latest version info:', error);
- }
- };
+ if (latestCommitHash.trim() !== commitRef.trim() && !infoMessageShown) {
+ const newVersionInfo = `New dev version available, commit ${latestCommitHash.slice(0, 7)}. You are using commit ${commitRef.slice(0, 7)}. Refresh to update.`;
+ setNewInfoMessage(newVersionInfo);
+ setInfoMessageShown(true);
+ }
+ }
+ } catch (error) {
+ console.error('Failed to fetch latest version info:', error);
+ }
+ };
- fetchVersionInfo();
- }, [setNewInfoMessage, isElectron, infoMessageShown]);
+ fetchVersionInfo();
+ }, [setNewInfoMessage, isElectron, infoMessageShown]);
- // preload banners
- useEffect(() => {
- const loadImages = async () => {
- const images = await importAll(require.context('../public/assets', true, /\.(png|jpe?g|svg)$/));
- const imageUrls = images.map((image) => image.default);
- preloadImages(imageUrls);
- };
+ // preload banners
+ useEffect(() => {
+ const loadImages = async () => {
+ const images = await importAll(require.context('../public/assets', true, /\.(png|jpe?g|svg)$/));
+ const imageUrls = images.map((image) => image.default);
+ preloadImages(imageUrls);
+ };
- loadImages();
- }, []);
+ loadImages();
+ }, []);
- // automatic dark mode without interefering with user's selected style
- useEffect(() => {
- if (isHomeRoute) return;
+ // fetch default subplebbits
+ useEffect(() => {
+ let didCancel = false;
+ fetch('https://raw.githubusercontent.com/plebbit/temporary-default-subplebbits/master/subplebbits.json', { cache: 'no-cache' })
+ .then((res) => res.json())
+ .then((res) => {
+ if (!didCancel) {
+ setDefaultSubplebbits(res);
+ }
+ });
+ return () => {
+ didCancel = true;
+ };
+ }, [setDefaultSubplebbits]);
- const darkModeMediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
- const isDarkMode = darkModeMediaQuery.matches;
+ // handle nested routes
+ useEffect(() => {
+ const path = location.pathname;
+ if (path.endsWith('/post')) {
+ setShowPostFormLink(false);
+ setShowPostForm(true);
+ } else {
+ setShowPostFormLink(true);
+ setShowPostForm(false);
+ }
- if (isDarkMode && !isHomeRoute) {
- setSelectedStyle('Tomorrow');
- setBodyStyle({
- background: '#1d1f21 none',
- color: '#c5c8c6',
- fontFamily: 'Arial, Helvetica, sans-serif',
- });
- localStorage.setItem('selectedStyle', 'Tomorrow');
- }
+ if (path.endsWith('/settings')) {
+ setIsSettingsOpen(true);
+ } else {
+ setIsSettingsOpen(false);
+ }
+ }, [location.pathname, setIsSettingsOpen, setShowPostForm, setShowPostFormLink]);
- const darkModeListener = (e) => {
- if (e.matches && !isHomeRoute) {
- setSelectedStyle('Tomorrow');
- setBodyStyle({
- background: '#1d1f21 none',
- color: '#c5c8c6',
- fontFamily: 'Arial, Helvetica, sans-serif',
- });
- localStorage.setItem('selectedStyle', 'Tomorrow');
- }
- };
-
- darkModeMediaQuery.addEventListener('change', darkModeListener);
-
- return () => {
- darkModeMediaQuery.removeEventListener('change', darkModeListener);
- };
- }, [isHomeRoute, setBodyStyle, setSelectedStyle]);
-
- // fetch default subplebbits
- useEffect(() => {
- let didCancel = false;
- fetch('https://raw.githubusercontent.com/plebbit/temporary-default-subplebbits/master/subplebbits.json', { cache: 'no-cache' })
- .then((res) => res.json())
- .then((res) => {
- if (!didCancel) {
- setDefaultSubplebbits(res);
- }
- });
- return () => {
- didCancel = true;
- };
- }, [setDefaultSubplebbits]);
-
- // handle nested routes
- useEffect(() => {
- const path = location.pathname;
- if (path.endsWith('/post')) {
- setShowPostFormLink(false);
- setShowPostForm(true);
- } else {
- setShowPostFormLink(true);
- setShowPostForm(false);
- }
-
- if (path.endsWith('/settings')) {
- setIsSettingsOpen(true);
- } else {
- setIsSettingsOpen(false);
- }
- }, [location.pathname, setIsSettingsOpen, setShowPostForm, setShowPostFormLink]);
-
- return (
-
-
-
-
-
-
-
-
-
-
-
- } />
- }>
- } />
- } />
-
- }>
- } />
- } />
-
- }>
- } />
- } />
-
- }>
- } />
-
- }>
- } />
-
- }>
- } />
-
- }>
- } />
-
- }>
- } />
-
- }>
- } />
-
- }>
- } />
-
- } />
-
-
- setIsCaptchaOpen(false)} />
-
- );
+ return (
+
+
+
+
+
+
+
+
+
+
+
+ } />
+ }>
+ } />
+ } />
+
+ }>
+ } />
+ } />
+
+ }>
+ } />
+ } />
+
+ }>
+ } />
+
+ }>
+ } />
+
+ }>
+ } />
+
+ }>
+ } />
+
+ }>
+ } />
+
+ }>
+ } />
+
+ }>
+ } />
+
+ } />
+
+
+ setIsCaptchaOpen(false)} />
+
+ );
}
diff --git a/src/components/Post.jsx b/src/components/Post.jsx
index 3750c61b..24c38bc4 100644
--- a/src/components/Post.jsx
+++ b/src/components/Post.jsx
@@ -81,7 +81,6 @@ const Post = ({ content, postQuoteOnClick, postQuoteOnOver, postQuoteOnLeave, po
parts.push(
{
maxHeight: '250px',
}}
>
-