Skip to content

Commit

Permalink
feat: initial discover implementation
Browse files Browse the repository at this point in the history
  • Loading branch information
Rexogamer committed Jun 16, 2024
1 parent 499ec69 commit 5e52ac1
Show file tree
Hide file tree
Showing 7 changed files with 209 additions and 29 deletions.
14 changes: 14 additions & 0 deletions i18n/strings/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,20 @@
"delete": "Delete",
"save": "Save"
},
"discover": {
"count_bots_one": "{{count}} servers",
"count_bots_other": "{{count}} servers",
"count_servers_one": "{{count}} servers",
"count_servers_other": "{{count}} servers",
"fetching_bots": "Loading bots…",
"fetching_servers": "Loading servers…",
"header_bots": "Discover Bots",
"header_servers": "Discover Servers",
"tabs": {
"bots": "Bots",
"servers": "Servers"
}
},
"loading": {
"generic": "Loading…",
"connecting": "Logging in…"
Expand Down
5 changes: 3 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -22,12 +22,13 @@
"@react-native-community/hooks": "^3.0.0",
"@rexovolt/react-native-side-menu": "^2.0.0",
"@traptitech/markdown-it-spoiler": "^1.1.6",
"@xmldom/xmldom": "^0.8.10",
"babel-plugin-module-resolver": "^5.0.2",
"date-fns": "^3.6.0",
"i18next": "^23.11.5",
"intl-pluralrules": "^2.0.1",
"markdown-it-regexp": "^0.4.0",
"mobx": "^6.12.3",
"mobx": "^6.12.4",
"mobx-react-lite": "^4.0.7",
"process": "^0.11.10",
"react": "^18.3.1",
Expand Down Expand Up @@ -87,7 +88,7 @@
"react-test-renderer": "^18.3.1",
"typescript": "^5.4.5",
"url-loader": "^4.1.1",
"webpack": "^5.91.0",
"webpack": "^5.92.0",
"webpack-cli": "^5.1.4",
"webpack-dev-server": "^4.15.2"
},
Expand Down
4 changes: 3 additions & 1 deletion src/components/navigation/ChannelIcon.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ interface CIChannel {

interface SpecialCIChannel {
type: 'special';
channel: 'Home' | 'Friends' | 'Saved Notes' | 'Debug';
channel: 'Home' | 'Friends' | 'Saved Notes' | 'Discover' | 'Debug';
}

export const ChannelIcon = ({
Expand All @@ -40,6 +40,8 @@ export const ChannelIcon = ({
<MaterialIcon name="group" size={24} color={color} />
) : channel.channel === 'Saved Notes' ? (
<MaterialIcon name="sticky-note-2" size={24} color={color} />
) : channel.channel === 'Discover' ? (
<MaterialCommunityIcon name="compass" size={24} color={color} />
) : channel.channel === 'Debug' ? (
<MaterialIcon name="bug-report" size={24} color={color} />
) : channel.channel.generateIconURL && channel.channel.generateIconURL() ? (
Expand Down
5 changes: 2 additions & 3 deletions src/components/navigation/ServerList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,11 @@ import MaterialCommunityIcon from 'react-native-vector-icons/MaterialCommunityIc

import {decodeTime} from 'ulid';

import {client} from '@rvmob/Generic';
import {app, client} from '@rvmob/Generic';
import {currentTheme, styles} from '../../Theme';
import {Text} from '../common/atoms';
import {Image} from '@rvmob/crossplat/Image';
import {DEFAULT_MAX_SIDE} from '../../lib/consts';
import {openUrl} from '@rvmob/lib/utils';

export const ServerList = observer(
({
Expand Down Expand Up @@ -142,7 +141,7 @@ export const ServerList = observer(
/>
<TouchableOpacity
onPress={() => {
openUrl('https://rvlt.gg/discover');
app.openChannel('discover');
}}
key={'serverlist-discover'}
style={styles.serverButton}>
Expand Down
5 changes: 4 additions & 1 deletion src/components/views/ChannelView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import {ChannelHeader} from '@rvmob/components/navigation/ChannelHeader';
import {FriendsPage} from '@rvmob/components/pages/FriendsPage';
import {HomePage} from '@rvmob/components/pages/HomePage';
import {VoiceChannel} from '@rvmob/components/pages/VoiceChannel';
import {DiscoverPage} from '@rvmob/pages/discover/DiscoverPage';

function MessageViewErrorMessage({
error,
Expand All @@ -40,7 +41,7 @@ function MessageViewErrorMessage({
);
}

type CVChannel = Channel | 'friends' | 'debug' | null;
type CVChannel = Channel | 'friends' | 'discover' | 'debug' | null;

export const ChannelView = observer(
({state, channel}: {state: any; channel: CVChannel}) => {
Expand All @@ -63,6 +64,8 @@ export const ChannelView = observer(
{channel ? (
channel === 'friends' ? (
<FriendsPage />
) : channel === 'discover' ? (
<DiscoverPage />
) : channel === 'debug' ? (
<View style={styles.flex}>
<ChannelHeader>
Expand Down
133 changes: 133 additions & 0 deletions src/pages/discover/DiscoverPage.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,133 @@
import {useEffect, useState} from 'react';
import {Platform, ScrollView, View} from 'react-native';
import {useTranslation} from 'react-i18next';

import {DOMParser} from '@xmldom/xmldom';

import {app, client} from '@rvmob/Generic';
import {currentTheme, styles} from '@rvmob/Theme';
import {Button, Text} from '@rvmob/components/common/atoms';
import {ChannelHeader} from '@rvmob/components/navigation/ChannelHeader';
import {ChannelIcon} from '@rvmob/components/navigation/ChannelIcon';

const parser = new DOMParser({
errorHandler: (level, message) => {
if (level === 'error') {
throw new Error(message);
}
},
});

const renderServers = (servers: any) => {
return servers.map((server: any) => {
console.log(server);
return (
<View
key={`discover-entry-${server._id}`}
style={{
marginBottom: 8,
borderRadius: 8,
padding: 8,
backgroundColor: currentTheme.backgroundSecondary,
}}>
<Text type={'h1'}>{server.name}</Text>
<Text colour={currentTheme.foregroundSecondary}>{server._id}</Text>
<Button
onPress={async () => {
!client.servers.get(server._id) &&
(await client.joinInvite(server._id));
app.openServer(client.servers.get(server._id));
app.openLeftMenu(true);
}}>
<Text>
{client.servers.get(server._id) ? 'Go to Server' : 'Join Server'}
</Text>
</Button>
</View>
);
});
};

export const DiscoverPage = () => {
const {t} = useTranslation();

const [tab, setTab] = useState<'servers' | 'bots'>('servers');
const [data, setData] = useState<any>(null);

useEffect(() => {
async function fetchData() {
const rawData = await fetch(`https://rvlt.gg/discover/${tab}`);
const unparsedText = await rawData.text();

// code based on https://codeberg.org/Doru/Discoverolt/src/branch/pages/index.html

const rawJSON = parser
.parseFromString(unparsedText, 'text/html')
// @ts-expect-error hmm
.getElementById('__NEXT_DATA__')?.childNodes[0].data;
const json = JSON.parse(rawJSON).props.pageProps;
setData(json);
}

fetchData();
}, [tab]);

return (
<View style={{flex: 1}}>
<ChannelHeader>
<View style={styles.iconContainer}>
<ChannelIcon channel={{type: 'special', channel: 'Discover'}} />
</View>
<Text style={styles.channelName}>
{t(`app.discover.header_${tab}`)}
</Text>
</ChannelHeader>
<View style={{flexDirection: 'row', margin: 8}}>
<Button
style={{flex: 1}}
onPress={() => {
if (tab !== 'servers') {
setData(null);
setTab('servers');
}
}}>
<Text>{t('app.discover.tabs.servers')}</Text>
</Button>
<Button
style={{flex: 1}}
onPress={() => {
if (tab !== 'bots') {
setData(null);
setTab('bots');
}
}}>
<Text>{t('app.discover.tabs.bots')}</Text>
</Button>
</View>
{data ? (
<>
<ScrollView
style={{flex: 1, padding: 8}}
contentContainerStyle={{
paddingBottom: Platform.OS === 'web' ? 0 : 8,
}}>
{tab === 'servers' ? (
<>
<Text type={'h2'}>
{t('app.discover.count_servers', {
count: data.servers.length,
})}
</Text>
{renderServers(data.servers)}
</>
) : (
<></>
)}
</ScrollView>
</>
) : (
<Text>{t(`app.discover.fetching_${tab}`)}</Text>
)}
</View>
);
};
Loading

0 comments on commit 5e52ac1

Please sign in to comment.