Mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-03-21 13:19:22 +01:00
Code Issues Projects Releases Packages Wiki Activity

Add notice if there's only 1 shortcut

Browse source
This commit is contained in:
Lim Chee Aun 2024-01-10 14:48:29 +08:00
parent 8c6563a671
commit 07f927d4ff
2 changed files with 106 additions and 91 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/app.css
View file

@ -1059,6 +1059,10 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
.ui-state { .ui-state {
padding: 16px; padding: 16px;
text-align: center; text-align: center;
.icon {
vertical-align: middle;
}
} }
.status-carousel-link { .status-carousel-link {

193
src/components/shortcuts-settings.jsx
View file

@ -279,92 +279,93 @@ function ShortcutsSettings({ onClose }) {
})} })}
</div> </div>
{shortcuts.length > 0 ? ( {shortcuts.length > 0 ? (
<ol class="shortcuts-list" ref={shortcutsListParent}> <>
{shortcuts.filter(Boolean).map((shortcut, i) => { <ol class="shortcuts-list" ref={shortcutsListParent}>
// const key = i + Object.values(shortcut); {shortcuts.filter(Boolean).map((shortcut, i) => {
const key = Object.values(shortcut).join('-'); // const key = i + Object.values(shortcut);
const { type } = shortcut; const key = Object.values(shortcut).join('-');
if (!SHORTCUTS_META[type]) return null; const { type } = shortcut;
let { icon, title, subtitle, excludeViewMode } = if (!SHORTCUTS_META[type]) return null;
SHORTCUTS_META[type]; let { icon, title, subtitle, excludeViewMode } =
if (typeof title === 'function') { SHORTCUTS_META[type];
title = title(shortcut, i); if (typeof title === 'function') {
} title = title(shortcut, i);
if (typeof subtitle === 'function') { }
subtitle = subtitle(shortcut, i); if (typeof subtitle === 'function') {
} subtitle = subtitle(shortcut, i);
if (typeof icon === 'function') { }
icon = icon(shortcut, i); if (typeof icon === 'function') {
} icon = icon(shortcut, i);
if (typeof excludeViewMode === 'function') { }
excludeViewMode = excludeViewMode(shortcut, i); if (typeof excludeViewMode === 'function') {
} excludeViewMode = excludeViewMode(shortcut, i);
const excludedViewMode = excludeViewMode?.includes( }
snapStates.settings.shortcutsViewMode, const excludedViewMode = excludeViewMode?.includes(
); snapStates.settings.shortcutsViewMode,
return ( );
<li key={key}> return (
<Icon icon={icon} /> <li key={key}>
<span class="shortcut-text"> <Icon icon={icon} />
<AsyncText>{title}</AsyncText> <span class="shortcut-text">
{subtitle && ( <AsyncText>{title}</AsyncText>
<> {subtitle && (
{' '} <>
<small class="ib insignificant">{subtitle}</small> {' '}
</> <small class="ib insignificant">{subtitle}</small>
)} </>
{excludedViewMode && ( )}
<span class="tag"> {excludedViewMode && (
Not available in current view mode <span class="tag">
</span> Not available in current view mode
)} </span>
</span> )}
<span class="shortcut-actions"> </span>
<button <span class="shortcut-actions">
type="button" <button
class="plain small" type="button"
disabled={i === 0} class="plain small"
onClick={() => { disabled={i === 0}
const shortcutsArr = Array.from(states.shortcuts); onClick={() => {
if (i > 0) { const shortcutsArr = Array.from(states.shortcuts);
const temp = states.shortcuts[i - 1]; if (i > 0) {
shortcutsArr[i - 1] = shortcut; const temp = states.shortcuts[i - 1];
shortcutsArr[i] = temp; shortcutsArr[i - 1] = shortcut;
states.shortcuts = shortcutsArr; shortcutsArr[i] = temp;
} states.shortcuts = shortcutsArr;
}} }
> }}
<Icon icon="arrow-up" alt="Move up" /> >
</button> <Icon icon="arrow-up" alt="Move up" />
<button </button>
type="button" <button
class="plain small" type="button"
disabled={i === shortcuts.length - 1} class="plain small"
onClick={() => { disabled={i === shortcuts.length - 1}
const shortcutsArr = Array.from(states.shortcuts); onClick={() => {
if (i < states.shortcuts.length - 1) { const shortcutsArr = Array.from(states.shortcuts);
const temp = states.shortcuts[i + 1]; if (i < states.shortcuts.length - 1) {
shortcutsArr[i + 1] = shortcut; const temp = states.shortcuts[i + 1];
shortcutsArr[i] = temp; shortcutsArr[i + 1] = shortcut;
states.shortcuts = shortcutsArr; shortcutsArr[i] = temp;
} states.shortcuts = shortcutsArr;
}} }
> }}
<Icon icon="arrow-down" alt="Move down" /> >
</button> <Icon icon="arrow-down" alt="Move down" />
<button </button>
type="button" <button
class="plain small" type="button"
onClick={() => { class="plain small"
setShowForm({ onClick={() => {
shortcut, setShowForm({
shortcutIndex: i, shortcut,
}); shortcutIndex: i,
}} });
> }}
<Icon icon="pencil" alt="Edit" /> >
</button> <Icon icon="pencil" alt="Edit" />
{/* <button </button>
{/* <button
type="button" type="button"
class="plain small" class="plain small"
onClick={() => { onClick={() => {
@ -373,11 +374,21 @@ function ShortcutsSettings({ onClose }) {
> >
<Icon icon="x" alt="Remove" /> <Icon icon="x" alt="Remove" />
</button> */} </button> */}
</span> </span>
</li> </li>
); );
})} })}
</ol> </ol>
{shortcuts.length === 1 &&
snapStates.settings.shortcutsViewMode !== 'float-button' && (
<div class="ui-state insignificant">
<Icon icon="info" />{' '}
<small>
Add more than one shortcut/column to make this work.
</small>
</div>
)}
</>
) : ( ) : (
<div class="ui-state insignificant"> <div class="ui-state insignificant">
<p>No shortcuts yet. Tap on the Add shortcut button.</p> <p>No shortcuts yet. Tap on the Add shortcut button.</p>