ClipSync-Mobile/src/components/clip/ClipViewRemote.tsx

65 lines
1.7 KiB
TypeScript

import React from 'react';
import axios from 'axios';
import {ScrollView, View, Text, useWindowDimensions} from 'react-native';
import ClipList from './ClipList';
import {store} from '../../redux/store';
import {useToast} from 'react-native-toast-notifications';
import {Button} from 'react-native-paper';
import {ps} from '../../utils';
import {useDispatch} from 'react-redux';
import {remoteClipAddToList} from '../../redux/reducers';
export default function ClipViewRemote() {
const [clips, setClips] = React.useState(
store.getState().remoteClip.remoteClip,
);
const toast = useToast();
const dispatch = useDispatch();
const {height, width} = useWindowDimensions();
async function getClips(dispatch) {
axios
.get(
'http://notifysync.simailadjalim.fr/clipboard?token=' +
store.getState().user.token,
)
.then((response, status) => {
let remoteclips = Object.values(response['data']['clipboard']);
setClips(remoteclips);
dispatch(remoteClipAddToList(remoteclips));
toast.show('fetched latest clips from remote');
})
.catch(response => {
toast.show(JSON.stringify(response));
toast.show('failed to fetch latest clips');
});
}
function getSignOutBtn() {
return (
<Button mode="elevated" onPress={() => {}}>
Sign out
</Button>
);
}
let title = 'Remote Clipboard';
return (
<View
style={{
width: '100%',
height: '100%',
flex: 1,
margin: width > 600 ? ps(10) : 0,
}}>
<Button mode="elevated" onPress={() => dispatch(getClips)}>
Refresh
</Button>
<ScrollView>
<ClipList type="remote" clips={clips} />
</ScrollView>
</View>
);
}