mirror of
https://github.com/cheeaun/phanpy.git
synced 2024-11-21 16:55:25 +03:00
Refactor List menu from nav menu
This commit is contained in:
Lim Chee Aun
parent
2d9cffc091
commit
a73d613dce
2 changed files with 99 additions and 95 deletions
|
|
@ -85,15 +85,6 @@ function NavMenu(props) {
|
||||||
return results;
|
return results;
|
||||||
}
|
}
|
||||||
|
|
||||||
const supportsLists = supports('@mastodon/lists');
|
|
||||||
const [lists, setLists] = useState([]);
|
|
||||||
useEffect(() => {
|
|
||||||
if (!supportsLists) return;
|
|
||||||
if (menuState === 'open') {
|
|
||||||
getLists().then(setLists);
|
|
||||||
}
|
|
||||||
}, [menuState === 'open']);
|
|
||||||
|
|
||||||
const buttonClickTS = useRef();
|
const buttonClickTS = useRef();
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
@ -229,47 +220,7 @@ function NavMenu(props) {
|
||||||
</span>
|
</span>
|
||||||
</MenuLink>
|
</MenuLink>
|
||||||
)}
|
)}
|
||||||
{lists?.length > 0 ? (
|
<ListMenu menuState={menuState} />
|
||||||
<SubMenu2
|
|
||||||
menuClassName="nav-submenu"
|
|
||||||
overflow="auto"
|
|
||||||
gap={-8}
|
|
||||||
label={
|
|
||||||
<>
|
|
||||||
<Icon icon="list" size="l" />
|
|
||||||
<span class="menu-grow">
|
|
||||||
<Trans>Lists</Trans>
|
|
||||||
</span>
|
|
||||||
<Icon icon="chevron-right" />
|
|
||||||
</>
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<MenuLink to="/l">
|
|
||||||
<span>
|
|
||||||
<Trans>All Lists</Trans>
|
|
||||||
</span>
|
|
||||||
</MenuLink>
|
|
||||||
{lists?.length > 0 && (
|
|
||||||
<>
|
|
||||||
<MenuDivider />
|
|
||||||
{lists.map((list) => (
|
|
||||||
<MenuLink key={list.id} to={`/l/${list.id}`}>
|
|
||||||
<span>{list.title}</span>
|
|
||||||
</MenuLink>
|
|
||||||
))}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</SubMenu2>
|
|
||||||
) : (
|
|
||||||
supportsLists && (
|
|
||||||
<MenuLink to="/l">
|
|
||||||
<Icon icon="list" size="l" />
|
|
||||||
<span>
|
|
||||||
<Trans>Lists</Trans>
|
|
||||||
</span>
|
|
||||||
</MenuLink>
|
|
||||||
)
|
|
||||||
)}
|
|
||||||
<MenuLink to="/b">
|
<MenuLink to="/b">
|
||||||
<Icon icon="bookmark" size="l" />{' '}
|
<Icon icon="bookmark" size="l" />{' '}
|
||||||
<span>
|
<span>
|
||||||
|
|
@ -447,4 +398,57 @@ function NavMenu(props) {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function ListMenu({ menuState }) {
|
||||||
|
const supportsLists = supports('@mastodon/lists');
|
||||||
|
const [lists, setLists] = useState([]);
|
||||||
|
useEffect(() => {
|
||||||
|
if (!supportsLists) return;
|
||||||
|
if (menuState === 'open') {
|
||||||
|
getLists().then(setLists);
|
||||||
|
}
|
||||||
|
}, [menuState, supportsLists]);
|
||||||
|
|
||||||
|
return lists.length > 0 ? (
|
||||||
|
<SubMenu2
|
||||||
|
menuClassName="nav-submenu"
|
||||||
|
overflow="auto"
|
||||||
|
gap={-8}
|
||||||
|
label={
|
||||||
|
<>
|
||||||
|
<Icon icon="list" size="l" />
|
||||||
|
<span class="menu-grow">
|
||||||
|
<Trans>Lists</Trans>
|
||||||
|
</span>
|
||||||
|
<Icon icon="chevron-right" />
|
||||||
|
</>
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<MenuLink to="/l">
|
||||||
|
<span>
|
||||||
|
<Trans>All Lists</Trans>
|
||||||
|
</span>
|
||||||
|
</MenuLink>
|
||||||
|
{lists?.length > 0 && (
|
||||||
|
<>
|
||||||
|
<MenuDivider />
|
||||||
|
{lists.map((list) => (
|
||||||
|
<MenuLink key={list.id} to={`/l/${list.id}`}>
|
||||||
|
<span>{list.title}</span>
|
||||||
|
</MenuLink>
|
||||||
|
))}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</SubMenu2>
|
||||||
|
) : (
|
||||||
|
supportsLists && (
|
||||||
|
<MenuLink to="/l">
|
||||||
|
<Icon icon="list" size="l" />
|
||||||
|
<span>
|
||||||
|
<Trans>Lists</Trans>
|
||||||
|
</span>
|
||||||
|
</MenuLink>
|
||||||
|
)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
export default memo(NavMenu);
|
export default memo(NavMenu);
|
||||||
|
|
|
||||||
90
src/locales/en.po
generated
90
src/locales/en.po
generated
|
|
@ -524,7 +524,7 @@ msgid "Cloak mode enabled"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/columns.jsx:26
|
#: src/components/columns.jsx:26
|
||||||
#: src/components/nav-menu.jsx:184
|
#: src/components/nav-menu.jsx:175
|
||||||
#: src/components/shortcuts-settings.jsx:139
|
#: src/components/shortcuts-settings.jsx:139
|
||||||
#: src/components/timeline.jsx:437
|
#: src/components/timeline.jsx:437
|
||||||
#: src/pages/catchup.jsx:876
|
#: src/pages/catchup.jsx:876
|
||||||
|
|
@ -624,7 +624,7 @@ msgid "Public"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/compose.jsx:1196
|
#: src/components/compose.jsx:1196
|
||||||
#: src/components/nav-menu.jsx:386
|
#: src/components/nav-menu.jsx:337
|
||||||
#: src/components/shortcuts-settings.jsx:165
|
#: src/components/shortcuts-settings.jsx:165
|
||||||
#: src/components/status.jsx:94
|
#: src/components/status.jsx:94
|
||||||
msgid "Local"
|
msgid "Local"
|
||||||
|
|
@ -700,7 +700,7 @@ msgstr ""
|
||||||
|
|
||||||
#: src/components/compose.jsx:1775
|
#: src/components/compose.jsx:1775
|
||||||
#: src/components/compose.jsx:1852
|
#: src/components/compose.jsx:1852
|
||||||
#: src/components/nav-menu.jsx:287
|
#: src/components/nav-menu.jsx:238
|
||||||
msgid "More…"
|
msgid "More…"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
|
|
@ -977,7 +977,7 @@ msgid "The end."
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/keyboard-shortcuts-help.jsx:43
|
#: src/components/keyboard-shortcuts-help.jsx:43
|
||||||
#: src/components/nav-menu.jsx:405
|
#: src/components/nav-menu.jsx:356
|
||||||
#: src/pages/catchup.jsx:1619
|
#: src/pages/catchup.jsx:1619
|
||||||
msgid "Keyboard shortcuts"
|
msgid "Keyboard shortcuts"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
@ -1074,7 +1074,7 @@ msgid "<0>Ctrl</0> + <1>Enter</1> or <2>⌘</2> + <3>Enter</3>"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/keyboard-shortcuts-help.jsx:147
|
#: src/components/keyboard-shortcuts-help.jsx:147
|
||||||
#: src/components/nav-menu.jsx:374
|
#: src/components/nav-menu.jsx:325
|
||||||
#: src/components/search-form.jsx:72
|
#: src/components/search-form.jsx:72
|
||||||
#: src/components/shortcuts-settings.jsx:52
|
#: src/components/shortcuts-settings.jsx:52
|
||||||
#: src/components/shortcuts-settings.jsx:179
|
#: src/components/shortcuts-settings.jsx:179
|
||||||
|
|
@ -1239,32 +1239,32 @@ msgstr ""
|
||||||
msgid "Post updated. Check it out."
|
msgid "Post updated. Check it out."
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:126
|
#: src/components/nav-menu.jsx:117
|
||||||
msgid "Menu"
|
msgid "Menu"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:162
|
#: src/components/nav-menu.jsx:153
|
||||||
msgid "Reload page now to update?"
|
msgid "Reload page now to update?"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:174
|
#: src/components/nav-menu.jsx:165
|
||||||
msgid "New update available…"
|
msgid "New update available…"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#. js-lingui-explicit-id
|
#. js-lingui-explicit-id
|
||||||
#: src/components/nav-menu.jsx:193
|
#: src/components/nav-menu.jsx:184
|
||||||
#: src/components/shortcuts-settings.jsx:140
|
#: src/components/shortcuts-settings.jsx:140
|
||||||
#: src/pages/following.jsx:22
|
#: src/pages/following.jsx:22
|
||||||
#: src/pages/following.jsx:141
|
#: src/pages/following.jsx:141
|
||||||
msgid "following.title"
|
msgid "following.title"
|
||||||
msgstr "Following"
|
msgstr "Following"
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:200
|
#: src/components/nav-menu.jsx:191
|
||||||
#: src/pages/catchup.jsx:871
|
#: src/pages/catchup.jsx:871
|
||||||
msgid "Catch-up"
|
msgid "Catch-up"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:207
|
#: src/components/nav-menu.jsx:198
|
||||||
#: src/components/shortcuts-settings.jsx:58
|
#: src/components/shortcuts-settings.jsx:58
|
||||||
#: src/components/shortcuts-settings.jsx:146
|
#: src/components/shortcuts-settings.jsx:146
|
||||||
#: src/pages/home.jsx:224
|
#: src/pages/home.jsx:224
|
||||||
|
|
@ -1275,7 +1275,7 @@ msgstr ""
|
||||||
msgid "Mentions"
|
msgid "Mentions"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:214
|
#: src/components/nav-menu.jsx:205
|
||||||
#: src/components/shortcuts-settings.jsx:49
|
#: src/components/shortcuts-settings.jsx:49
|
||||||
#: src/components/shortcuts-settings.jsx:152
|
#: src/components/shortcuts-settings.jsx:152
|
||||||
#: src/pages/filters.jsx:24
|
#: src/pages/filters.jsx:24
|
||||||
|
|
@ -1286,31 +1286,15 @@ msgstr ""
|
||||||
msgid "Notifications"
|
msgid "Notifications"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:217
|
#: src/components/nav-menu.jsx:208
|
||||||
msgid "New"
|
msgid "New"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:228
|
#: src/components/nav-menu.jsx:219
|
||||||
msgid "Profile"
|
msgid "Profile"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:241
|
#: src/components/nav-menu.jsx:227
|
||||||
#: src/components/nav-menu.jsx:268
|
|
||||||
#: src/components/shortcuts-settings.jsx:50
|
|
||||||
#: src/components/shortcuts-settings.jsx:158
|
|
||||||
#: src/pages/list.jsx:126
|
|
||||||
#: src/pages/lists.jsx:16
|
|
||||||
#: src/pages/lists.jsx:50
|
|
||||||
msgid "Lists"
|
|
||||||
msgstr ""
|
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:249
|
|
||||||
#: src/components/shortcuts.jsx:215
|
|
||||||
#: src/pages/list.jsx:133
|
|
||||||
msgid "All Lists"
|
|
||||||
msgstr ""
|
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:276
|
|
||||||
#: src/components/shortcuts-settings.jsx:54
|
#: src/components/shortcuts-settings.jsx:54
|
||||||
#: src/components/shortcuts-settings.jsx:195
|
#: src/components/shortcuts-settings.jsx:195
|
||||||
#: src/pages/bookmarks.jsx:11
|
#: src/pages/bookmarks.jsx:11
|
||||||
|
|
@ -1318,7 +1302,7 @@ msgstr ""
|
||||||
msgid "Bookmarks"
|
msgid "Bookmarks"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:296
|
#: src/components/nav-menu.jsx:247
|
||||||
#: src/components/shortcuts-settings.jsx:55
|
#: src/components/shortcuts-settings.jsx:55
|
||||||
#: src/components/shortcuts-settings.jsx:201
|
#: src/components/shortcuts-settings.jsx:201
|
||||||
#: src/pages/catchup.jsx:1446
|
#: src/pages/catchup.jsx:1446
|
||||||
|
|
@ -1329,13 +1313,13 @@ msgstr ""
|
||||||
msgid "Likes"
|
msgid "Likes"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:302
|
#: src/components/nav-menu.jsx:253
|
||||||
#: src/pages/followed-hashtags.jsx:14
|
#: src/pages/followed-hashtags.jsx:14
|
||||||
#: src/pages/followed-hashtags.jsx:44
|
#: src/pages/followed-hashtags.jsx:44
|
||||||
msgid "Followed Hashtags"
|
msgid "Followed Hashtags"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:310
|
#: src/components/nav-menu.jsx:261
|
||||||
#: src/pages/account-statuses.jsx:331
|
#: src/pages/account-statuses.jsx:331
|
||||||
#: src/pages/filters.jsx:54
|
#: src/pages/filters.jsx:54
|
||||||
#: src/pages/filters.jsx:93
|
#: src/pages/filters.jsx:93
|
||||||
|
|
@ -1343,54 +1327,70 @@ msgstr ""
|
||||||
msgid "Filters"
|
msgid "Filters"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:318
|
#: src/components/nav-menu.jsx:269
|
||||||
msgid "Muted users"
|
msgid "Muted users"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:326
|
#: src/components/nav-menu.jsx:277
|
||||||
msgid "Muted users…"
|
msgid "Muted users…"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:333
|
#: src/components/nav-menu.jsx:284
|
||||||
msgid "Blocked users"
|
msgid "Blocked users"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:341
|
#: src/components/nav-menu.jsx:292
|
||||||
msgid "Blocked users…"
|
msgid "Blocked users…"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:353
|
#: src/components/nav-menu.jsx:304
|
||||||
msgid "Accounts…"
|
msgid "Accounts…"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:363
|
#: src/components/nav-menu.jsx:314
|
||||||
#: src/pages/login.jsx:189
|
#: src/pages/login.jsx:189
|
||||||
#: src/pages/status.jsx:835
|
#: src/pages/status.jsx:835
|
||||||
#: src/pages/welcome.jsx:64
|
#: src/pages/welcome.jsx:64
|
||||||
msgid "Log in"
|
msgid "Log in"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:380
|
#: src/components/nav-menu.jsx:331
|
||||||
#: src/components/shortcuts-settings.jsx:57
|
#: src/components/shortcuts-settings.jsx:57
|
||||||
#: src/components/shortcuts-settings.jsx:172
|
#: src/components/shortcuts-settings.jsx:172
|
||||||
#: src/pages/trending.jsx:441
|
#: src/pages/trending.jsx:441
|
||||||
msgid "Trending"
|
msgid "Trending"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:392
|
#: src/components/nav-menu.jsx:343
|
||||||
#: src/components/shortcuts-settings.jsx:165
|
#: src/components/shortcuts-settings.jsx:165
|
||||||
msgid "Federated"
|
msgid "Federated"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:415
|
#: src/components/nav-menu.jsx:366
|
||||||
msgid "Shortcuts / Columns…"
|
msgid "Shortcuts / Columns…"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/nav-menu.jsx:425
|
#: src/components/nav-menu.jsx:376
|
||||||
#: src/components/nav-menu.jsx:439
|
#: src/components/nav-menu.jsx:390
|
||||||
msgid "Settings…"
|
msgid "Settings…"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
||||||
|
#: src/components/nav-menu.jsx:420
|
||||||
|
#: src/components/nav-menu.jsx:447
|
||||||
|
#: src/components/shortcuts-settings.jsx:50
|
||||||
|
#: src/components/shortcuts-settings.jsx:158
|
||||||
|
#: src/pages/list.jsx:126
|
||||||
|
#: src/pages/lists.jsx:16
|
||||||
|
#: src/pages/lists.jsx:50
|
||||||
|
msgid "Lists"
|
||||||
|
msgstr ""
|
||||||
|
|
||||||
|
#: src/components/nav-menu.jsx:428
|
||||||
|
#: src/components/shortcuts.jsx:215
|
||||||
|
#: src/pages/list.jsx:133
|
||||||
|
msgid "All Lists"
|
||||||
|
msgstr ""
|
||||||
|
|
||||||
#: src/components/notification-service.jsx:160
|
#: src/components/notification-service.jsx:160
|
||||||
msgid "Notification"
|
msgid "Notification"
|
||||||
msgstr ""
|
msgstr ""
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue