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

Algemene info tonen voor helpende handen #249

Closed
wants to merge 6 commits into from
Closed
Changes from 1 commit
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
Prev Previous commit
Next Next commit
Add ticketContext
everaertdorothee committed Jun 20, 2023
commit 948065ebe79435a3d5b95530f69840b337d729b1
10 changes: 7 additions & 3 deletions App.tsx
Original file line number Diff line number Diff line change
@@ -17,9 +17,11 @@ import useBackgroundRefresh from './hooks/useBackgroundRefresh';
import { RootSiblingParent } from 'react-native-root-siblings';
import * as Sentry from 'sentry-expo';
import { DataContextProvider } from './hooks/useDataContext';
import { TicketContextProvider } from './hooks/useTicketContext';

Sentry.init({
dsn: 'https://[email protected]/4505356514426880',
dsn:
'https://[email protected]/4505356514426880',
enableInExpoDevelopment: true,
debug: true, // If `true`, Sentry will try to print out useful debugging information if something goes wrong with sending the event. Set it to `false` in production
});
@@ -52,8 +54,10 @@ export default function App(): React.ReactElement | null {
<RootSiblingParent>
<SafeAreaProvider>
<DataContextProvider>
<Navigation colorScheme={colorScheme} />
<StatusBar style="light" />
<TicketContextProvider>
<Navigation colorScheme={colorScheme} />
<StatusBar style="light" />
</TicketContextProvider>
</DataContextProvider>
</SafeAreaProvider>
</RootSiblingParent>
37 changes: 0 additions & 37 deletions components/contexts/TicketProvider.tsx

This file was deleted.

67 changes: 67 additions & 0 deletions hooks/useTicketContext.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
import AsyncStorage from '@react-native-async-storage/async-storage';
import React, { ReactNode, useContext, useEffect, useState } from 'react';
import { TicketMetadata } from '../models/TicketMetadata';
import { IOrderable } from '../models/IOrderable';
import useRefresh from './useRefresh';

type DataContextType = {
data: TicketMetadata[] | undefined;
refreshing: boolean;
refreshContext: () => Promise<void>;
};

const DataContext = React.createContext<DataContextType | undefined>(undefined);

type DataContextProviderProps = {
children: ReactNode;
};

export const TicketContextProvider: React.FC<DataContextProviderProps> = ({
children,
}: DataContextProviderProps) => {
const [data, setData] = useState<TicketMetadata[]>();

const { refresh, refreshing } = useRefresh();

const loadDataFromStorage = async () => {
const dataFromStorage = await AsyncStorage.getItem('DATA');
if (dataFromStorage) {
const parsedData: TicketMetadata[] = JSON.parse(dataFromStorage);
setData(parsedData);
}
};

const refreshContext = async () => {
await refresh();
await loadDataFromStorage();
console.log('loaded');
};
useEffect(() => {
const asyncWrap = async () => {
await loadDataFromStorage();
};
asyncWrap();
}, []);

return (
<DataContext.Provider
value={{
data,
refreshing,
refreshContext,
}}
>
{children}
</DataContext.Provider>
);
};

export const useDataContext = (): DataContextType => {
const context = useContext(DataContext);
if (!context) {
throw new Error(
'useDataContext must be used within an DataContextProvider',
);
}
return context;
};
18 changes: 18 additions & 0 deletions models/TicketMetadata.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import { IOrderable } from './IOrderable';

export interface TicketMetadata {
key: string;
content: any;
lastUpdated: Date;
}

export const createMetadata = (
content: IOrderable[] | IOrderable,
key: string,
): TicketMetadata => {
return {
key,
content,
lastUpdated: new Date(),
};
};
42 changes: 39 additions & 3 deletions screens/MoreScreen.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,47 @@
import React, { useContext } from 'react';
import React, { useContext ,useState,useEffect} from 'react';
import { FlatList, Image } from 'react-native';
import NavigationListItem from '../components/NavigationListItem';
import { Separator, View } from '../components/Themed/Themed';
import { TicketContext } from '../components/contexts/TicketProvider';
import { TicketMetadata } from '../models/TicketMetadata';
import { useDataContext } from '../hooks/useTicketContext';

const MoreScreen: React.FC = () => {
const { Ticket } = useContext(TicketContext);

const { data, refreshContext, refreshing } = useDataContext();
const [TicketData, setTicketData] = useState<TicketMetadata>();

useEffect(() => {
if (data) {
const filtered = data.filter((x) => x.key === VOLUNTEER_ITEMS)[0];
console.log(filtered)

setTicketData(filtered);
}
}, [data]);

const handleRefresh = async () => {
await refreshContext();
};

// Always try to refresh data on load. We can do it here because the screen is never unmounted in the bottom tab.
useEffect(() => {
const refreshAsync = async () => {
await refreshContext();
};
refreshAsync();
}, []);






console.log(TicketData)






const items = [
{