Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

groups: eliminate discover/find interface #3233

Merged
merged 2 commits into from
Feb 9, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 0 additions & 16 deletions ui/src/app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@ import useMedia, { useIsDark, useIsMobile } from '@/logic/useMedia';
import useErrorHandler from '@/logic/useErrorHandler';
import {
useAnalyticsId,
useCalm,
useLogActivity,
useSettingsLoaded,
useTheme,
Expand All @@ -42,7 +41,6 @@ import GroupInfo from '@/groups/GroupAdmin/GroupInfo';
import ProfileModal from '@/profiles/ProfileModal';
import MultiDMEditModal from '@/dms/MultiDMEditModal';
import NewChannelModal from '@/channels/NewChannel/NewChannelModal';
import FindGroups from '@/groups/FindGroups';
import GroupPreviewModal from '@/groups/Join/GroupPreview';
import RejectConfirmModal from '@/groups/Join/RejectConfirmModal';
import EditProfile from '@/profiles/EditProfile/EditProfile';
Expand Down Expand Up @@ -257,20 +255,6 @@ function GroupsRoutes({ state, location, isMobile, isSmall }: RoutesProps) {
/>
)}
</Route>
{/* Find by Invite URL */}
<Route
path="/find/:ship/:name"
element={<FindGroups title={`Discover • ${groupsTitle}`} />}
/>
{/* Find by Nickname or @p */}
<Route
path="/find/:ship"
element={<FindGroups title={`Discover • ${groupsTitle}`} />}
/>
<Route
path="/find"
element={<FindGroups title={`Discover • ${groupsTitle}`} />}
/>
<Route
path="/profile/edit"
element={<EditProfile title={`Edit Profile • ${groupsTitle}`} />}
Expand Down
15 changes: 0 additions & 15 deletions ui/src/components/Sidebar/MobileSidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ import BellIcon from '../icons/BellIcon';
import HomeIconMobileNav from '../icons/HomeIconMobileNav';
import MessagesIcon from '../icons/MessagesIcon';
import Avatar from '../Avatar';
import NavigateIcon from '../icons/NavigateIcon';

function GroupsTab(props: { isInactive: boolean; isDarkMode: boolean }) {
const navigate = useNavigate();
Expand Down Expand Up @@ -182,20 +181,6 @@ export default function MobileSidebar() {
isInactive={isInactive('/notifications')}
isDarkMode={isDarkMode}
/>
<NavTab
to="/find"
linkClass="h-full !pb-0 flex flex-col items-start justify-start"
>
<div className="flex-1" />
<div className="flex h-8 w-8 items-center justify-center">
<NavigateIcon
isInactive={isInactive('/find')}
isDarkMode={isDarkMode}
className="h-[20px] w-[18px]"
/>
</div>
<div className="flex-1" />
</NavTab>
{needsUpdate ? (
<NavTab
to="/update-needed"
Expand Down
9 changes: 1 addition & 8 deletions ui/src/components/Sidebar/Sidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export default function Sidebar() {
const [isScrolling, setIsScrolling] = useState(false);
const [atTop, setAtTop] = useState(true);
const { sortFn, setSortFn, sortOptions, sortGroups } = useGroupSort();
const { data: groups, isLoading } = useGroupsWithQuery();
const { data: groups } = useGroupsWithQuery();
const invitedGroups = usePendingGangsWithoutClaim();
const pinnedGroups = usePinnedGroups();
const loadingGroups = useLoadingGroups();
Expand Down Expand Up @@ -224,13 +224,6 @@ export default function Sidebar() {
{hasNewGroups && (
<div className="mx-2">{newGroupsDisplay}</div>
)}

{!sortedGroups.length && !hasNewGroups && !isLoading && (
<div className="mx-4 my-2 rounded-lg bg-indigo-50 p-4 leading-5 text-gray-700 dark:bg-indigo-900/50">
Check out <strong>Discover</strong> above to find new
groups in your network or view group invites.
</div>
)}
</div>
</>
)}
Expand Down
85 changes: 38 additions & 47 deletions ui/src/nav/MobileRoot.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ import MobileHeader from '@/components/MobileHeader';
import Layout from '@/components/Layout/Layout';
import AddIconMobileNav from '@/components/icons/AddIconMobileNav';
import GroupJoinList from '@/groups/GroupJoinList';
import NavigateIcon from '@/components/icons/NavigateIcon';
import WelcomeCard from '@/components/WelcomeCard';
import AddGroupSheet from '@/groups/AddGroupSheet';

Expand All @@ -35,7 +34,7 @@ export default function MobileRoot() {
const loadingGroups = useLoadingGroups();
const newGroups = useNewGroups();
const gangsWithClaims = useGangsWithClaim();
const { data: groups, isLoading } = useGroupsWithQuery();
const { data: groups } = useGroupsWithQuery();
const sortedGroups = sortGroups(groups);
const pinnedGroupsOptions = useMemo(
() =>
Expand Down Expand Up @@ -84,56 +83,48 @@ export default function MobileRoot() {
<nav className="flex h-full flex-1 flex-col overflow-y-auto overflow-x-hidden">
<WelcomeCard />
<div className="flex-1">
{sortedGroups.length === 0 && !isLoading ? (
<div className="mx-4 my-2 rounded-lg bg-indigo-50 p-4 leading-5 text-gray-700 dark:bg-indigo-900/50">
Tap the <span className="sr-only">find icon</span>
<NavigateIcon className="inline-flex h-4 w-4" /> below to find new
groups in your network or view group invites.
</div>
) : (
<GroupsScrollingContext.Provider value={isScrolling}>
<GroupList groups={sortedGroups} isScrolling={scroll.current}>
{hasPinnedGroups ||
hasPendingGangs ||
hasGangsWithClaims ||
hasLoadingGroups ||
hasNewGroups ? (
<>
<div className="px-4">
{hasPinnedGroups ? (
<>
<h2 className="mb-0.5 p-2 font-sans text-gray-400">
Pinned
</h2>
{pinnedGroupsOptions}
<GroupsScrollingContext.Provider value={isScrolling}>
<GroupList groups={sortedGroups} isScrolling={scroll.current}>
{hasPinnedGroups ||
hasPendingGangs ||
hasGangsWithClaims ||
hasLoadingGroups ||
hasNewGroups ? (
<>
<div className="px-4">
{hasPinnedGroups ? (
<>
<h2 className="mb-0.5 p-2 font-sans text-gray-400">
Pinned
</h2>
{pinnedGroupsOptions}

<h2 className="my-2 p-2 font-sans text-gray-400">
All Groups
</h2>
</>
) : null}
<h2 className="my-2 p-2 font-sans text-gray-400">
All Groups
</h2>
</>
) : null}

{hasLoadingGroups &&
Object.keys(loadingGroups).map(([flag, _]) => (
<GangItem key={flag} flag={flag} isJoining />
))}
{hasLoadingGroups &&
Object.keys(loadingGroups).map(([flag, _]) => (
<GangItem key={flag} flag={flag} isJoining />
))}

{hasGangsWithClaims &&
gangsWithClaims.map((flag) => (
<GangItem key={flag} flag={flag} />
))}
{hasGangsWithClaims &&
gangsWithClaims.map((flag) => (
<GangItem key={flag} flag={flag} />
))}

{hasNewGroups && newGroupsOptions}
</div>
{hasNewGroups && newGroupsOptions}
</div>

{hasPendingGangs && (
<GroupJoinList highlightAll gangs={pendingGangs} />
)}
</>
) : null}
</GroupList>
</GroupsScrollingContext.Provider>
)}
{hasPendingGangs && (
<GroupJoinList highlightAll gangs={pendingGangs} />
)}
</>
) : null}
</GroupList>
</GroupsScrollingContext.Provider>
<AddGroupSheet open={addGroupOpen} onOpenChange={setAddGroupOpen} />
</div>
</nav>
Expand Down
Loading