diff --git a/README.md b/README.md index 82b4c7ae..7a6d3583 100644 --- a/README.md +++ b/README.md @@ -11,8 +11,8 @@ Phanpy This is an alternative web client for [Mastodon](https://joinmastodon.org/). -🔗 **Production**: https://phanpy.social
-🔗 **Development**: https://dev.phanpy.social +🔗 **Production**: https://phanpy.social (`production` branch)
+🔗 **Development**: https://dev.phanpy.social (`main` branch, may break more often) Everything is designed and engineered for my own use case, following my taste and vision. This is a personal side project for me to learn about Mastodon and experiment with new UI/UX ideas. diff --git a/src/app.jsx b/src/app.jsx index bfc03417..5613c658 100644 --- a/src/app.jsx +++ b/src/app.jsx @@ -143,6 +143,7 @@ export function App() { window.masto = await login({ url: `https://${instanceURL}`, accessToken, + disableVersionCheck: true, }); const mastoAccount = await masto.accounts.verifyCredentials(); @@ -183,6 +184,7 @@ export function App() { window.masto = await login({ url: `https://${instanceURL}`, accessToken, + disableVersionCheck: true, }); setIsLoggedIn(true); } catch (e) { diff --git a/src/components/status.jsx b/src/components/status.jsx index 03f0e76a..595361ba 100644 --- a/src/components/status.jsx +++ b/src/components/status.jsx @@ -662,39 +662,40 @@ function Status({ )} {' '} - {size !== 'l' && uri ? ( - - {' '} - - {createdAtDate.toLocaleString()} - - - ) : ( - - {' '} - - {createdAtDate.toLocaleString()} - - - )} + {size !== 'l' && + (uri ? ( + + {' '} + + {createdAtDate.toLocaleString()} + + + ) : ( + + {' '} + + {createdAtDate.toLocaleString()} + + + ))}
{ - if (uiState === 'closed') { - window.close(); - } - }, [uiState]); + useTitle( + editStatus + ? 'Editing source status' + : replyToStatus + ? `Replying to @${ + replyToStatus.account?.acct || replyToStatus.account?.username + }` + : 'Compose', + ); if (uiState === 'closed') { return ( diff --git a/src/pages/notifications.jsx b/src/pages/notifications.jsx index 7652878f..4a4c4720 100644 --- a/src/pages/notifications.jsx +++ b/src/pages/notifications.jsx @@ -338,6 +338,7 @@ export default () => { class="plain block" disabled={uiState === 'loading'} onClick={() => loadNotifications()} + style={{ marginBlockEnd: '6em' }} > {uiState === 'loading' ? : <>Show more…} diff --git a/src/pages/status.jsx b/src/pages/status.jsx index f0b3452d..1f2b8d7f 100644 --- a/src/pages/status.jsx +++ b/src/pages/status.jsx @@ -111,18 +111,25 @@ export default ({ id }) => { }, [heroStatus]); const heroContentText = useMemo(() => { if (!heroStatus) return ''; - const { content } = heroStatus; - const div = document.createElement('div'); - div.innerHTML = content; - let text = div.innerText.trim(); + const { spoilerText, content } = heroStatus; + let text; + if (spoilerText) { + text = spoilerText; + } else { + const div = document.createElement('div'); + div.innerHTML = content; + text = div.innerText.trim(); + } if (text.length > 64) { + // "The title should ideally be less than 64 characters in length" + // https://www.w3.org/Provider/Style/TITLE.html text = text.slice(0, 64) + '…'; } return text; }, [heroStatus]); useTitle( heroDisplayName && heroContentText - ? `${heroDisplayName}: ${heroContentText}` + ? `${heroDisplayName}: "${heroContentText}"` : 'Status', ); diff --git a/src/utils/useTitle.js b/src/utils/useTitle.js index 86007a14..70e297cf 100644 --- a/src/utils/useTitle.js +++ b/src/utils/useTitle.js @@ -4,6 +4,6 @@ const { VITE_CLIENT_NAME: CLIENT_NAME } = import.meta.env; export default (title) => { useEffect(() => { - document.title = title ? `${title} - ${CLIENT_NAME}` : CLIENT_NAME; + document.title = title ? `${title} / ${CLIENT_NAME}` : CLIENT_NAME; }, [title]); };