Skip to content
Snippets Groups Projects
Commit a87d4ab8 authored by Aleksander Westergaard Karlsen's avatar Aleksander Westergaard Karlsen
Browse files

#2 Add feedback for pagination and search

parent 4d0b4b13
No related branches found
No related tags found
1 merge request!2Resolve "Pagination"
import React from "react"; import React from "react";
import {ApolloProvider} from "@apollo/client"; import {ApolloProvider} from "@apollo/client";
import {ApolloClient, InMemoryCache, NormalizedCacheObject} from "@apollo/client"; import {ApolloClient, InMemoryCache, NormalizedCacheObject} from "@apollo/client";
import {StyleProvider} from "native-base";
import Menu from "./components/Menu/Menu"; import Menu from "./components/Menu/Menu";
import {LogBox} from "react-native";
LogBox.ignoreAllLogs();
const client: ApolloClient<NormalizedCacheObject> = new ApolloClient({ const client: ApolloClient<NormalizedCacheObject> = new ApolloClient({
uri: "http://it2810-23.idi.ntnu.no:3000/", uri: "http://it2810-23.idi.ntnu.no:3000/",
......
...@@ -14,8 +14,21 @@ const styles = StyleSheet.create({ ...@@ -14,8 +14,21 @@ const styles = StyleSheet.create({
alignItems: "center" alignItems: "center"
}, },
loader: { loader: {
backgroundColor: "#101010", backgroundColor: "#101010"
margin: 15 },
feedback: {
height: 60,
marginTop: 20
},
danger: {
color: "#d9534f",
marginLeft: "auto",
marginRight: "auto"
},
endText: {
color: "#d4a600",
marginLeft: "auto",
marginRight: "auto"
} }
}); });
...@@ -171,15 +184,37 @@ function MovieContainer() { ...@@ -171,15 +184,37 @@ function MovieContainer() {
return ( return (
<Content style={styles.bg} contentContainerStyle={{flex: 1}}> <Content style={styles.bg} contentContainerStyle={{flex: 1}}>
{movies && movies.length !== 0 ? (
// Movies
<FlatList <FlatList
data={movies} data={movies}
renderItem={renderItem} renderItem={renderItem}
extraData={currentPage < pageCount} extraData={currentPage < pageCount}
onEndReached={nextPage} onEndReached={nextPage}
numColumns={2} numColumns={2}
ListFooterComponent={
<View style={styles.feedback}>
{queryLoading && <ActivityIndicator size="large" color="#d4a600" style={styles.loader} />}
{!queryLoading && pageLoaded && pageCount !== 0 && movies.length > 0 && (
<Text style={styles.endText}>
{movies.length} {movies.length === 1 ? "RESULT" : "RESULTS"}
</Text>
)}
</View>
}
contentContainerStyle={styles.container} contentContainerStyle={styles.container}
/> />
) : moviesData && moviesData.movies.movies.length === 0 ? (
// No results
<View style={styles.feedback}>
<Text style={styles.danger}>NO RESULTS</Text>
</View>
) : (
// Loading
<View style={styles.feedback}>
{queryLoading && <ActivityIndicator size="large" color="#d4a600" style={styles.loader} />} {queryLoading && <ActivityIndicator size="large" color="#d4a600" style={styles.loader} />}
</View>
)}
</Content> </Content>
); );
} }
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment