placementt-core 11.0.803 → 11.0.892

package/src/hooks.tsx

@@ -11,13 +11,13 @@ import { getFiles, getFormsFromId, getPlacementbyId, getPlacementsWhere, getUser
 import { arrayUniqueValues, arraysEqual, convertDate, editNestedObject, getAccess, getDateDiff, getUniqueId, objectsEqual, validateEmail } from "./firebase/util";
 import { addPlacement, editPlacementStage, uploadFiles } from "./firebase/writeDatabase";
 import {
-    Address,
+    AlumniConvoUser,
     ApplicantStage,
-    ApplicantWorkflow,
     Application,
     ArrowObject, CohortData, CustomFormSchema, FileItem, FlagCodes, InstituteData, OnboardingDocs, PlacementListing, Products,
+    ProviderContactData,
     ProviderData,
-    QueryObject, QueryObjectConstraint, SavedPlacement, Sorts, StudentPlacementData, UserData, UserGroupData, WorkflowStage
+    QueryObject, QueryObjectConstraint, SchoolData, Sorts, StudentPlacementData, UserData, UserGroupData, WorkflowStage
 } from "./typeDefinitions";
 import algoliasearch from "algoliasearch";
 import {getDownloadURL, ref} from "firebase/storage";
@@ -405,6 +405,100 @@ export function useNewInstitutePlacementList({id, user, filters, view, cohort, q
 }
 
 
+
+type AlumniPaginatorParams = {
+    user?: UserData,
+    alumniConvoUser?: AlumniConvoUser,
+    school?: string,
+    queryConstraints?: QueryObjectConstraint,
+    ql?: number,
+    view: "list"|"table",
+    filters?: FilterObject,
+}
+
+
+
+export function useAlumniPaginator({user, alumniConvoUser, filters, view, school, queryConstraints, ql=DEFAULTQUERYLIMIT}:AlumniPaginatorParams) {
+    const [query, setQuery] = useState<QueryObject[]>();
+
+    const sorts:Sorts = {}
+
+
+    const {tableData, pageUp, pageDown, setFilters, page, setView, loading} = useDataViewerPaginator({view, filters, sorts, queryLimit: ql, data: query})
+    const firebaseQuery = new FirebaseQuery();
+
+    useEffect(() => {
+        const createQuery = async () => {
+            // Sets the query of for the DataViewerPaginator
+
+
+            const getQueryAccess = async () => {
+                const constraints:QueryObjectConstraint = [];
+
+                if (user) {
+                    constraints.push(["oId", "==", user.oId]);
+
+                    if (user.userGroup === "admin" && user.userType === "Staff") return constraints;
+        
+                    if (user.userType === "Staff") {
+                        if (user.viewSchools === "all") return constraints;
+        
+                        if (user.viewSchools === "none") return false;
+        
+                        if (user.viewSchools === "some") {
+                            if (!school) return false;
+        
+                            if (user?.visibleSchools?.includes(school as string)) return constraints;
+                        }
+                        return false;
+                    }
+                    return false;
+                }
+
+                if (alumniConvoUser) {
+                    constraints.push(["oId", "==", alumniConvoUser.oId]);
+                    console.log("ALUMNI CONVO USER");
+
+                    if ((school || alumniConvoUser.schoolId) && school === alumniConvoUser.schoolId) return constraints;
+                    console.log("ALUMNI ACCESS TRUE");
+                    if (alumniConvoUser.schoolId) { 
+                        const school = await firebaseQuery.getDocData(["schools", alumniConvoUser.schoolId]) as SchoolData;
+                        console.log("SCHOOL ACCESS", school, school.alumniConversations);
+                        return school.alumniConversations ? constraints : false;
+    
+                    } else {
+                        const institute = await firebaseQuery.getDocData(["institutes", alumniConvoUser.oId]) as InstituteData;
+                        return institute.alumniConversations ? constraints : false;
+                    }
+                }
+                return false;
+            }
+            const constraints = await getQueryAccess();
+            console.log("CONSTRAINTS", constraints);
+            if (!constraints) return;
+    
+            school && constraints.push(["schoolId", "==", school]);
+            queryConstraints && constraints.unshift(...queryConstraints);
+    
+            return constraints;
+        }
+        console.log("Creating query");
+        createQuery().then((constraints) => {
+            setQuery([{
+                path: ["alumni"],
+                where: constraints
+            }])
+        })
+    }, [user, queryConstraints, school])
+
+    useEffect(() => {
+        console.log("Alumni data", query, tableData);
+    }, [tableData]);
+
+    return {tableData, page, loading, setFilters, setView, pageUp, pageDown, sorts}
+}
+
+
 const algoliaPlacementSearch = async (user: UserData, query?: string, sort?: [string, {value: string, direction: "asc"|"desc"}], page?: number, filters?: FilterObject, limit?: number, cohort?: string, inProgress?: boolean) => {
     const algoliaClient = algoliasearch(process.env.NODE_ENV === "development" ? "A0ZB50I7VS" : "XMPXCMUUOJ", user.algoliaKey);
     const placementsIndex = algoliaClient.initIndex(sort ? Object.values(sort[1]).join("_") : "placements");
@@ -894,200 +988,36 @@ export function useFilterTablePaginator({data}:{data:{[key:string]:{[key:string]
     return ({...{tableData, setPage, setFilters, page}});
 }
 
-export function usePlacementListingPaginator({data, user}:{data:QueryObject[], user: UserData}) {
-    const [tableData, setTableData] = useState<{[key:string]:PlacementListing&{savedPlacement: SavedPlacement}}>({});
-    const [page, setPage] = useState([1, 0]);
-    const [filters, setFilters] = useState<{[key:string]: unknown}>();
-    const [queryAnchor, setQueryAnchor] = useState<{startKey: string, endKey: string, startQueryPos: number, endQueryPos: number}>({startKey: "", endKey: "", startQueryPos: 0, endQueryPos: 0});
-    const [prevEntryIds, setPrevEntryIds] = useState<{[key:string]:number}>({});
+export function useProviderContactPaginator({data, user, view, filters}:{data:QueryObject[], user: UserData, view: "list"|"table", filters?: FilterObject}) {
+    const [query, setQuery] = useState<QueryObject[]>();
     const firebaseQuery = new FirebaseQuery();
 
-    const getDataFromQuery = async (
-        itemList: {[key: string]: any} = {}, currentQueryAnchor=queryAnchor, cursorDirection?:"increase"|"decrease"|undefined, prevEntries=prevEntryIds, loadMoreFromQuery=false):Promise<any> => {
-        let cursorPos:number;
-        if (page[0] > page[1]) {
-            cursorPos = currentQueryAnchor.endQueryPos;
-        } else {
-            cursorPos = currentQueryAnchor.startQueryPos;
-        }
-
-        const querySchema:QueryObject = data?.[cursorPos];
-
-        const createQuery = (queryData?:QueryObject) => {
-            const constraints:any[] = [
-                where("savedById", "==", user.userType === "Staff" ? user.oId : user.id),
-                where("savedByProduct", "==", user.product),
-                where("savedByUserType", "==", user.userType === "Staff" ? "Organisation" : "Student"),
-            ]
-
-            if (user.userType === "Students") {
-                constraints.push(where("listed", "==", true));
-            }
-
-            queryData?.where && queryData.where.forEach((w) => {
-                constraints.push(where(...w));
-            });
-
-            filters && Object.entries(filters).forEach(([key, value]) => {
-                constraints.push(where(key, "==", value));
-            });
-
-            if (queryData?.orderBy) {
-                if (queryData.orderBy === "documentId") {
-                    constraints.push(orderBy(documentId()));
-                } else {
-                    constraints.push(orderBy(queryData.orderBy));
-                }
-            } else {
-                constraints.push(orderBy(documentId()));
-            }
-
-
-            if (page[0] > page[1] && !cursorDirection) { // Going up
-                currentQueryAnchor.endKey && constraints.push(startAfter(currentQueryAnchor.endKey));
-                constraints.push(limit(10));
-                if (!loadMoreFromQuery) {
-                    currentQueryAnchor = {...currentQueryAnchor, startQueryPos: currentQueryAnchor.endQueryPos};
-                }
-            } else if (page[0] < page[1] && !cursorDirection) { // Going down
-                if (!loadMoreFromQuery) {
-                    currentQueryAnchor = {...currentQueryAnchor, endQueryPos: currentQueryAnchor.startQueryPos};
-                }
-                constraints.push(limitToLast(10));
-                if (currentQueryAnchor.startKey) {
-                    currentQueryAnchor.startKey && constraints.push(endBefore(currentQueryAnchor.startKey));
-                } else {
-                    currentQueryAnchor.startKey && constraints.push(endAt(currentQueryAnchor.startKey));
-                }
-            } else {
-                if (cursorDirection === "decrease") {
-                    constraints.push(limitToLast(10));
-                } else {
-                    constraints.push(limit(10));
-                }
-            }
-            return constraints;
-        };
-
-        const constraints = createQuery(querySchema);
-        // console.log(queryId, "constraints", constraints)
-
-        const q = query(collection(db, "savedPlacements"), ...(constraints));
-        const queryResults:{[key:string]: unknown} = {};
-
-        const queryData = await getDocs(q);
-
-        // console.log("queryData.size", queryData.size)
-
-
-        const reverseIfBack = (docs:QueryDocumentSnapshot<DocumentData>[]) => {
-            if (page[0] < page[1]) {
-                return docs.reverse();
-            }
-            return docs;
-        };
-
-        let index = 0;
-        reverseIfBack(queryData.docs).forEach(async (doc: QueryDocumentSnapshot) => {
-            if (Object.keys(queryResults).length + Object.keys(itemList).length === 10) {
-                return;
-            }
-
-            let position = Object.keys(itemList).length+(page[0]-1)*10+index+1;
-            if (page[0] < page[1]) {
-                position = (page[0])*10-index-Object.keys(itemList).length;
-            }
-
-            // console.log(index, "doc.id", doc.id, position, "E", prevEntries[doc.id])
-
-            if (itemList[doc.id] || (prevEntries[doc.id] && prevEntries[doc.id] !== position)) {
-                console.log("Removing ", doc.id, ": E=", prevEntries[doc.id], ", G=", position);
-                return;
-            }
-
-            const item = doc.data() as SavedPlacement;
-            item.id = doc.id;
-            queryResults[doc.id] = item;
-            index = index+1;
-            if (prevEntries[doc.id]) return;
-            prevEntries[doc.id] = position;
-        });
-
-        if (cursorDirection === "decrease" || page[0] < page[1]) {
-            itemList = {...Object.fromEntries(Object.entries(queryResults).reverse()), ...itemList};
-        } else {
-            itemList = {...itemList, ...queryResults};
+    const getAdditionalData = async (k: string, v: ProviderContactData) => {
+        if (v.savedBy?.[user.oId].activities?.includes("workExperience")) {
+            const placementsCount = await firebaseQuery.getCount("placementListings", [where(`savedBy.${user.oId}.exists`, "==", true), where("providerContactId", "==", k)]);
+            return {...v, plcaements: placementsCount};
         }
+        return v;
+    }
 
-        setPrevEntryIds(prevEntries);
-
-        if (queryData.size < 10 && Object.keys(itemList).length < 10) {
-            if (page[0] > page[1] && cursorPos+1 < data.length) {
-                console.log("Increase query index");
-                return getDataFromQuery(itemList, {...currentQueryAnchor, endQueryPos: currentQueryAnchor.endQueryPos+1}, "increase", prevEntries);
-            } else if (page[0] < page[1] && cursorPos > 0) {
-                console.log("Decrease query index");
-                return getDataFromQuery(itemList, {...currentQueryAnchor, startQueryPos: currentQueryAnchor.startQueryPos-1}, "decrease", prevEntries);
-            }
-        }
-
-        if (Object.keys(itemList).length < 10 && queryData.size === 10) {
-            console.log("Shorter than ten");
-            // if(loadMoreFromQuery){return}
-            return getDataFromQuery(itemList, {...currentQueryAnchor, startKey: Object.keys(itemList)[0], endKey: Object.keys(itemList).slice(-1)[0]}, undefined, prevEntries, true);
-        }
-
-        if (queryData.size === 0 &&
-            Object.keys(itemList).length === 0 &&
-            currentQueryAnchor.endQueryPos+1 === data.length &&
-            page[0] > 1) {
-            setTableData({});
-            setQueryAnchor((a) => ({...a, startKey: ""}));
-            return;
-        }
-
-        setQueryAnchor({...currentQueryAnchor, startKey: Object.keys(itemList)[0], endKey: Object.keys(itemList).slice(-1)[0]});
-
-        const finalData = Object.fromEntries(await Promise.all(Object.entries(itemList).map(async ([k, v]:[string, SavedPlacement]) => {
-            const placement = await firebaseQuery.getDocData(["placementListings", v.placementId || ""]) as PlacementListing;
-            const address = await firebaseQuery.getDocData(["addresses", placement.addressId || ""]).catch(() => ({["address-line1"]: "Unknown address"}));
-            const provider = await firebaseQuery.getDocData(["providers", placement.providerId || ""]).catch(() => ({name: "Unknown"})) as ProviderData;
-            const status = provider.name !== "Unknown" ? getPlacementStatus(provider, placement, v) : "Deleted";
-            return [k, {...address, ...provider, ...placement, email: placement.providerEmail, status: status, savedPlacement: v}];
-        })));
-        setTableData(finalData);
-    };
-
-    const getPlacementStatus = (provider: ProviderData, placement: PlacementListing, savedPlacement: SavedPlacement):"active"|"requiresApproval"|"awaitingProviderApproval"|"public"|"blocked"|"notReviewed"|"notPublic"|"unknown" => {
-        if (savedPlacement.status === "Blocked") return "blocked";
-        if (savedPlacement.status === "Accepted") return "active";
-
-        if (user.product === "admin") {
-            if (placement.mapConsent === undefined) return "notReviewed";
-            if (placement.mapConsent === false) return "notPublic";
-            return "unknown";
-        };
+    const {tableData, pageUp, pageDown, setFilters, page, setView, loading} = useDataViewerPaginator({view, filters, queryLimit: 20, data: query, additionalEntryProcessing: getAdditionalData})
 
-        if (!provider.insurance) return "awaitingProviderApproval";
-        
-        return "requiresApproval";
-    };
 
     useEffect(() => {
-        if (!filters) return;
+        const constraints:QueryObjectConstraint = [
+            [`savedBy.${user.oId}.exists`, "==", true],
+        ]
 
-        setPage([1, 0]);
-        setTableData({});
-        setQueryAnchor({startKey: "", endKey: "", startQueryPos: 0, endQueryPos: 0});
-        setPrevEntryIds({});
-    }, [filters]);
-
-    // Fetch new data when queries or page change
-    useEffect(() => {
-        getDataFromQuery();
-    }, [page]);
+        if (user.userType === "Students") {
+            constraints.push([`savedBy.${user.oId}.cohorts.${user.cohort}.listed`, "==", true]);
+        }
+        setQuery([{
+            path: ["providerContacts"],
+            where: constraints
+        }])
+    }, [user]);
 
-    return ({...{tableData, setPage, setFilters, page}});
+    return ({...{tableData, pageUp, pageDown, setFilters, page, setView, loading}});
 }
 
 type UserPaginatorParams = {
@@ -1130,8 +1060,8 @@ export function useCohortUserPaginator({user, cohort, data, search, userType, so
         }
         if (
             (!user.viewCohorts && user.userGroup !== "admin") ||
-            user.viewCohorts === "none" ||
-            (user.viewCohorts === "some" && cohort !== "all" && !user.visibleCohorts?.includes(cohort || ""))) {
+            (user.viewCohorts === "none" && user.userGroup !== "admin") ||
+            (user.viewCohorts === "some" && user.userGroup !== "admin" && cohort !== "all" && !user.visibleCohorts?.includes(cohort || ""))) {
             setQueries(undefined);
             return;
         }
@@ -1476,514 +1406,514 @@ export function useLazyLoadQueryList({path, constraints, number, onItemFetched}:
 }
 
 
-type PublicPlacementListingLoaderParams = {
-    providerId?: string,
-    number: number,
-}
-
-export function usePublicPlacementListingLoader({providerId, number=5}:PublicPlacementListingLoaderParams) {
-    const [items, setItems] = useState<{[key:string]:{[key:string]:unknown}}>({});
-    const [loadMoreIcon, setLoadMoreIcon] = useState<boolean>(false);
-
-    const [lastItem, setLastItem] = useState<QueryDocumentSnapshot<DocumentData>>();
-    const firebaseQuery = new FirebaseQuery();
-
-    const reset = () => {
-        setItems({});
-        setLastItem(undefined);
-    };
-
-    const loadMore = async () => {
-        setLoadMoreIcon(true);
-        let formattedConstraints:QueryConstraint[] = [
-            where("status", "==", "listed"),
-            limit(number)
-        ];
-
-        if (providerId) {
-            formattedConstraints.push(where("providerId", "==", providerId));
-        }
-        if (lastItem) {
-            formattedConstraints.push(startAfter(lastItem));
-        }
-        const documents = await firebaseQuery.getDocsWhere("placementListings", formattedConstraints, true) as QuerySnapshot<DocumentData>;
-
-        console.log("docs", documents.docs);
-        setLastItem(documents.docs[documents.docs.length-1]);
-
-        const processedItems = Object.fromEntries(await Promise.all(Object.values(documents.docs).map(async (doc) => {
-            let itemObj = {...doc.data(), id: doc.id} as PlacementListing;
-
-            if (itemObj.addressId) {
-                const address = await firebaseQuery.getDocData(["addresses", itemObj.addressId]) as Address;
-                delete address.id;
-                itemObj = {...address, ...itemObj};
-            }
-            if (itemObj.applicantWorkflowId) {
-                const applicantWorkflow = (await firebaseQuery.getDocData(["applicantWorkflows", itemObj.applicantWorkflowId]) as ApplicantWorkflow).workflow.filter((i) => i.id === 1)[0];
-                const applicantFiles = applicantWorkflow.files ? Object.fromEntries(await Promise.all(applicantWorkflow.files?.map(async (fileId) => {
-                    const file = await firebaseQuery.getDocData(["files", fileId]);
-                    file.url = await getDownloadURL(ref(storage, `providers/${itemObj.providerId}/${file.fileName}`));
-
-                    return [fileId, file];
-                }))) : [];
-                const applicantForms = applicantWorkflow.forms ? Object.fromEntries(await Promise.all(applicantWorkflow.forms?.map(async (formId) => {
-                    return [formId, await firebaseQuery.getDocData(["forms", formId])];
-                }))) : [];
-
-                applicantWorkflow.viewableFiles = applicantFiles;
-                applicantWorkflow.formDetails = applicantForms;
-                itemObj = {...itemObj, applicantWorkflow: [applicantWorkflow]};
-            }
-            return [doc.id, itemObj];
-        })))
-
-        setItems((i) => ({...i, ...processedItems}));
-        setLoadMoreIcon(false);
-    };
-    useEffect(() => {
-        loadMore();
-    }, []);
-
-    return ({...{items, loadMore, loadMoreIcon, reset}});
-}
-
-export type ApplicationHookParams = {
-    successText: {
-        submitted: {
-            title: string;
-            desc: string;
-        };
-        draftSaved: {
-            title: string;
-            desc: string;
-        };
-        stageComplete: {
-            title: string;
-            desc: string;
-        };
-        outcome: {
-            title: string;
-            desc: string;
-        };
-    };
-    setSuccessPopup: import("react").Dispatch<import("react").SetStateAction<"submitted" | "draftSaved" | "stageComplete" | "outcome" | undefined>>;
-    openSuccessPopup: (type: "submitted" | "draftSaved" | "stageComplete" | "outcome") => void;
-    setFApplication: import("react").Dispatch<import("react").SetStateAction<Partial<Application>>>;
-    fApplication: Partial<Application>;
-    draftSaved: boolean;
-    profileUrl: string | undefined;
-    successPopup: "submitted" | "draftSaved" | "stageComplete" | "outcome" | undefined;
-    fApplicationId: string | undefined;
-    fListing: PlacementListing | false | undefined;
-    student: UserData | undefined;
-    fProvider: {
-        details?: ProviderData;
-        profile?: string;
-        id?: string;
-    } | undefined;
-    onFApply: (draft?: boolean) => Promise<void>;
-    setFormComplete: (formId: string, e: {
-        [key: string]: unknown;
-    }) => void;
-    viewFile: (file: string, onOpen: (url: string) => void) => void
-    addFile: (files: string[], fileId: number) => void;
-    uploadedFiles?: {
-        [key: string]: FileItem;
-    };
-    getCurrentStage: (stage: number) => Promise<{
-        stage: ApplicantStage;
-        completedSections: {
-            submitted?: string | undefined;
-            filesViewed?: string[] | undefined;
-            formsCompleted?: {
-                [key: string]: unknown;
-            } | undefined;
-            filesUploaded?: {
-                [key: number]: string[];
-            } | undefined;
-        };
-    }>;
-    currentStageComplete?: boolean;
-    progressStage: (type: number | "accept" | "reject", e?: {
-        feedback?: string;
-    }) => Promise<void>;
-};
-
-export function useCreateApplicationRenderer({user, listingId, listing, provider, application, applicationId, orgContext}:
-    {user:UserData, listingId:string, applicationId?: string, listing?: PlacementListing, application?: Partial<Application>,
-        orgContext?: {details: ProviderData, addresses: {[key: string]: OrganisationAddress}, applicantWorkflows: {[key: string]: ApplicantWorkflow}},
-        provider?: {details?: ProviderData, profile?: string, id?: string}}) {
-
-        const firebaseQuery = new FirebaseQuery();
-
-        let applicationWithoutAdditionalData = {...(application || {})} as any;
-        delete applicationWithoutAdditionalData.listing;
-        delete applicationWithoutAdditionalData.address;
-        delete applicationWithoutAdditionalData.provider;
+// type PublicPlacementListingLoaderParams = {
+//     providerId?: string,
+//     number: number,
+// }
+
+// export function usePublicPlacementListingLoader({providerId, number=5}:PublicPlacementListingLoaderParams) {
+//     const [items, setItems] = useState<{[key:string]:{[key:string]:unknown}}>({});
+//     const [loadMoreIcon, setLoadMoreIcon] = useState<boolean>(false);
+
+//     const [lastItem, setLastItem] = useState<QueryDocumentSnapshot<DocumentData>>();
+//     const firebaseQuery = new FirebaseQuery();
+
+//     const reset = () => {
+//         setItems({});
+//         setLastItem(undefined);
+//     };
+
+//     const loadMore = async () => {
+//         setLoadMoreIcon(true);
+//         let formattedConstraints:QueryConstraint[] = [
+//             where("status", "==", "listed"),
+//             limit(number)
+//         ];
+
+//         if (providerId) {
+//             formattedConstraints.push(where("providerId", "==", providerId));
+//         }
+//         if (lastItem) {
+//             formattedConstraints.push(startAfter(lastItem));
+//         }
+//         const documents = await firebaseQuery.getDocsWhere("placementListings", formattedConstraints, true) as QuerySnapshot<DocumentData>;
+
+//         console.log("docs", documents.docs);
+//         setLastItem(documents.docs[documents.docs.length-1]);
+
+//         const processedItems = Object.fromEntries(await Promise.all(Object.values(documents.docs).map(async (doc) => {
+//             let itemObj = {...doc.data(), id: doc.id} as PlacementListing;
+
+//             if (itemObj.addressId) {
+//                 const address = await firebaseQuery.getDocData(["addresses", itemObj.addressId]) as Address;
+//                 delete address.id;
+//                 itemObj = {...address, ...itemObj};
+//             }
+//             if (itemObj.applicantWorkflowId) {
+//                 const applicantWorkflow = (await firebaseQuery.getDocData(["applicantWorkflows", itemObj.applicantWorkflowId]) as ApplicantWorkflow).workflow.filter((i) => i.id === 1)[0];
+//                 const applicantFiles = applicantWorkflow.files ? Object.fromEntries(await Promise.all(applicantWorkflow.files?.map(async (fileId) => {
+//                     const file = await firebaseQuery.getDocData(["files", fileId]);
+//                     file.url = await getDownloadURL(ref(storage, `providers/${itemObj.providerId}/${file.fileName}`));
+
+//                     return [fileId, file];
+//                 }))) : [];
+//                 const applicantForms = applicantWorkflow.forms ? Object.fromEntries(await Promise.all(applicantWorkflow.forms?.map(async (formId) => {
+//                     return [formId, await firebaseQuery.getDocData(["forms", formId])];
+//                 }))) : [];
+
+//                 applicantWorkflow.viewableFiles = applicantFiles;
+//                 applicantWorkflow.formDetails = applicantForms;
+//                 itemObj = {...itemObj, applicantWorkflow: [applicantWorkflow]};
+//             }
+//             return [doc.id, itemObj];
+//         })))
+
+//         setItems((i) => ({...i, ...processedItems}));
+//         setLoadMoreIcon(false);
+//     };
+//     useEffect(() => {
+//         loadMore();
+//     }, []);
+
+//     return ({...{items, loadMore, loadMoreIcon, reset}});
+// }
+
+// export type ApplicationHookParams = {
+//     successText: {
+//         submitted: {
+//             title: string;
+//             desc: string;
+//         };
+//         draftSaved: {
+//             title: string;
+//             desc: string;
+//         };
+//         stageComplete: {
+//             title: string;
+//             desc: string;
+//         };
+//         outcome: {
+//             title: string;
+//             desc: string;
+//         };
+//     };
+//     setSuccessPopup: import("react").Dispatch<import("react").SetStateAction<"submitted" | "draftSaved" | "stageComplete" | "outcome" | undefined>>;
+//     openSuccessPopup: (type: "submitted" | "draftSaved" | "stageComplete" | "outcome") => void;
+//     setFApplication: import("react").Dispatch<import("react").SetStateAction<Partial<Application>>>;
+//     fApplication: Partial<Application>;
+//     draftSaved: boolean;
+//     profileUrl: string | undefined;
+//     successPopup: "submitted" | "draftSaved" | "stageComplete" | "outcome" | undefined;
+//     fApplicationId: string | undefined;
+//     fListing: PlacementListing | false | undefined;
+//     student: UserData | undefined;
+//     fProvider: {
+//         details?: ProviderData;
+//         profile?: string;
+//         id?: string;
+//     } | undefined;
+//     onFApply: (draft?: boolean) => Promise<void>;
+//     setFormComplete: (formId: string, e: {
+//         [key: string]: unknown;
+//     }) => void;
+//     viewFile: (file: string, onOpen: (url: string) => void) => void
+//     addFile: (files: string[], fileId: number) => void;
+//     uploadedFiles?: {
+//         [key: string]: FileItem;
+//     };
+//     getCurrentStage: (stage: number) => Promise<{
+//         stage: ApplicantStage;
+//         completedSections: {
+//             submitted?: string | undefined;
+//             filesViewed?: string[] | undefined;
+//             formsCompleted?: {
+//                 [key: string]: unknown;
+//             } | undefined;
+//             filesUploaded?: {
+//                 [key: number]: string[];
+//             } | undefined;
+//         };
+//     }>;
+//     currentStageComplete?: boolean;
+//     progressStage: (type: number | "accept" | "reject", e?: {
+//         feedback?: string;
+//     }) => Promise<void>;
+// };
+
+// export function useCreateApplicationRenderer({user, listingId, listing, provider, application, applicationId, orgContext}:
+//     {user:UserData, listingId:string, applicationId?: string, listing?: PlacementListing, application?: Partial<Application>,
+//         orgContext?: {details: ProviderData, addresses: {[key: string]: OrganisationAddress}, applicantWorkflows: {[key: string]: ApplicantWorkflow}},
+//         provider?: {details?: ProviderData, profile?: string, id?: string}}) {
+
+//         const firebaseQuery = new FirebaseQuery();
+
+//         let applicationWithoutAdditionalData = {...(application || {})} as any;
+//         delete applicationWithoutAdditionalData.listing;
+//         delete applicationWithoutAdditionalData.address;
+//         delete applicationWithoutAdditionalData.provider;
     
-        const [fApplication, setFApplication] = useState<Partial<Application>>(application ? applicationWithoutAdditionalData : {
-            uid: user.userType === "Students" ? user.id : undefined,
-            listingId: listingId,
-            addressId: listing?.addressId,
-            stage: 1,
-            reqUserType: "Students",
-            status: "draft"});
-        const [fApplicationId, setFApplicationId] = useState<string|undefined>(applicationId);
-        const [draftSaved, setDraftSaved] = useState(false);
-        const [fProvider, setFProvider] = useState<{details?: ProviderData, profile?: string, id?: string}|undefined>(provider);
-        const [fListing, setFListing] = useState<PlacementListing|false|undefined>(Object.keys(listing || {}).length > 5 ? listing : undefined);
-        const [student, setStudent] = useState<UserData|undefined>(user.userType === "Students" ? user : undefined);
-        const [profileUrl, setProfileUrl] = useState<string>();
-        const [successPopup, setSuccessPopup] = useState<"submitted"|"draftSaved"|"stageComplete"|"outcome">();
-        const [uploadedFiles, setUploadedFiles] = useState<{[key: string]: FileItem}>();
-        const [currentStageComplete, setCurrentStageComplete] = useState<boolean>();
-
-        useEffect(() => {
-            const getListing = async () => {
-                console.log("Checking ID")
-                if (!listingId) return;
-                console.log("Getting listing")
-                console.log("LISTING PARAM", listing, Object.keys(listing || {}).length > 5);
-
-                const listingData = (Object.keys(listing || {}).length > 5) ? listing : (await firebaseQuery.getDocData(["placementListings", listingId]).catch(() => false) as PlacementListing|false);
+//         const [fApplication, setFApplication] = useState<Partial<Application>>(application ? applicationWithoutAdditionalData : {
+//             uid: user.userType === "Students" ? user.id : undefined,
+//             listingId: listingId,
+//             addressId: listing?.addressId,
+//             stage: 1,
+//             reqUserType: "Students",
+//             status: "draft"});
+//         const [fApplicationId, setFApplicationId] = useState<string|undefined>(applicationId);
+//         const [draftSaved, setDraftSaved] = useState(false);
+//         const [fProvider, setFProvider] = useState<{details?: ProviderData, profile?: string, id?: string}|undefined>(provider);
+//         const [fListing, setFListing] = useState<PlacementListing|false|undefined>(Object.keys(listing || {}).length > 5 ? listing : undefined);
+//         const [student, setStudent] = useState<UserData|undefined>(user.userType === "Students" ? user : undefined);
+//         const [profileUrl, setProfileUrl] = useState<string>();
+//         const [successPopup, setSuccessPopup] = useState<"submitted"|"draftSaved"|"stageComplete"|"outcome">();
+//         const [uploadedFiles, setUploadedFiles] = useState<{[key: string]: FileItem}>();
+//         const [currentStageComplete, setCurrentStageComplete] = useState<boolean>();
+
+//         useEffect(() => {
+//             const getListing = async () => {
+//                 console.log("Checking ID")
+//                 if (!listingId) return;
+//                 console.log("Getting listing")
+//                 console.log("LISTING PARAM", listing, Object.keys(listing || {}).length > 5);
+
+//                 const listingData = (Object.keys(listing || {}).length > 5) ? listing : (await firebaseQuery.getDocData(["placementListings", listingId]).catch(() => false) as PlacementListing|false);
                 
-                console.log("LISTINGDATA", listingData, Object.keys(listing || {}).length > 5 ? {a: "string"} : "AAA");
+//                 console.log("LISTINGDATA", listingData, Object.keys(listing || {}).length > 5 ? {a: "string"} : "AAA");
                 
                 
                 
-                const address = listingData ? (user.product === "providers" && orgContext) ? orgContext.addresses[listingData.addressId || ""] : await firebaseQuery.getDocData(["addresses", listingData.addressId as string]) as Address : undefined;
-                const workflow = listingData ? (user.product === "providers" && orgContext) ? orgContext.applicantWorkflows[listingData.applicantWorkflowId || ""] as ApplicantWorkflow : await firebaseQuery.getDocData(["applicantWorkflows", listingData.applicantWorkflowId as string]) as ApplicantWorkflow : undefined;
+//                 const address = listingData ? (user.product === "providers" && orgContext) ? orgContext.addresses[listingData.addressId || ""] : await firebaseQuery.getDocData(["addresses", listingData.addressId as string]) as Address : undefined;
+//                 const workflow = listingData ? (user.product === "providers" && orgContext) ? orgContext.applicantWorkflows[listingData.applicantWorkflowId || ""] as ApplicantWorkflow : await firebaseQuery.getDocData(["applicantWorkflows", listingData.applicantWorkflowId as string]) as ApplicantWorkflow : undefined;
             
-                if (workflow && listingData) {
-                    workflow.workflow = await Promise.all(workflow.workflow.map(async (s) => {
-                        const applicantFiles = s.files ? Object.fromEntries(await Promise.all(s.files?.map(async (fileId: string) => {
-                            const file = await firebaseQuery.getDocData(["files", fileId]);
-                            file.url = await getDownloadURL(ref(storage, `providers/${listingData?.providerId}/${file.fileName}`));
+//                 if (workflow && listingData) {
+//                     workflow.workflow = await Promise.all(workflow.workflow.map(async (s) => {
+//                         const applicantFiles = s.files ? Object.fromEntries(await Promise.all(s.files?.map(async (fileId: string) => {
+//                             const file = await firebaseQuery.getDocData(["files", fileId]);
+//                             file.url = await getDownloadURL(ref(storage, `providers/${listingData?.providerId}/${file.fileName}`));
     
-                            return [fileId, file];
-                        }))) : [];
-                        const applicantForms = s.forms ? Object.fromEntries(await Promise.all(s.forms?.map(async (formId: string) => {
-                            return [formId, await firebaseQuery.getDocData(["forms", formId])];
-                        }))) : [];
+//                             return [fileId, file];
+//                         }))) : [];
+//                         const applicantForms = s.forms ? Object.fromEntries(await Promise.all(s.forms?.map(async (formId: string) => {
+//                             return [formId, await firebaseQuery.getDocData(["forms", formId])];
+//                         }))) : [];
     
-                        return {...s, viewableFiles: applicantFiles, formDetails: applicantForms};
-                    }));
-                    delete workflow.id;
-                }
-                if (address) {
-                    delete address.id;
-                }
-
-                console.log("Setting listing")
-                setFListing((listingData && workflow) ? {...listingData, ...address, applicantWorkflow: workflow.workflow} as PlacementListing : false);
-
-
-                if ((fProvider?.id === application?.providerId) && user.product === "providers") {
-                    setFProvider({details: orgContext?.details, id: user.oId});
-                } else if (listingData && listingData?.providerId) {
-                    console.log("Getting provider from DB");
-                    const provider = await firebaseQuery.getDocData(["providers", listingData.providerId]) as ProviderData;
-                    console.log("Provider", provider);
-                    setFProvider({details: provider, id: listingData.providerId});
-                }
-            }
-
-            getListing();
-        }, [listingId, listing]);
+//                         return {...s, viewableFiles: applicantFiles, formDetails: applicantForms};
+//                     }));
+//                     delete workflow.id;
+//                 }
+//                 if (address) {
+//                     delete address.id;
+//                 }
+
+//                 console.log("Setting listing")
+//                 setFListing((listingData && workflow) ? {...listingData, ...address, applicantWorkflow: workflow.workflow} as PlacementListing : false);
+
+
+//                 if ((fProvider?.id === application?.providerId) && user.product === "providers") {
+//                     setFProvider({details: orgContext?.details, id: user.oId});
+//                 } else if (listingData && listingData?.providerId) {
+//                     console.log("Getting provider from DB");
+//                     const provider = await firebaseQuery.getDocData(["providers", listingData.providerId]) as ProviderData;
+//                     console.log("Provider", provider);
+//                     setFProvider({details: provider, id: listingData.providerId});
+//                 }
+//             }
+
+//             getListing();
+//         }, [listingId, listing]);
     
-        useEffect(() => {
-            if (student?.id !== application?.uid) {
-                if (user.userType === "Students") {
-                    setStudent(user);
-                } else if (user.product === "providers" && application?.uid) {
-                    firebaseQuery.getDocData(["users", application.uid]).then((s) => setStudent(s as UserData));
-                }
-            }
-        }, []);
+//         useEffect(() => {
+//             if (student?.id !== application?.uid) {
+//                 if (user.userType === "Students") {
+//                     setStudent(user);
+//                 } else if (user.product === "providers" && application?.uid) {
+//                     firebaseQuery.getDocData(["users", application.uid]).then((s) => setStudent(s as UserData));
+//                 }
+//             }
+//         }, []);
     
-        useEffect(() => {
-            setFListing(Object.keys(listing || {}).length > 5 ? listing : undefined);
-        }, [listing]);
+//         useEffect(() => {
+//             setFListing(Object.keys(listing || {}).length > 5 ? listing : undefined);
+//         }, [listing]);
     
-        useEffect(() => {
-            if (provider?.profile) return;
-            if (!provider?.id) return;
+//         useEffect(() => {
+//             if (provider?.profile) return;
+//             if (!provider?.id) return;
     
-            getDownloadURL(ref(storage, `providers/${provider?.id}/profilePic.png`)).then(setProfileUrl).catch(() => null);
-        }, [provider]);
+//             getDownloadURL(ref(storage, `providers/${provider?.id}/profilePic.png`)).then(setProfileUrl).catch(() => null);
+//         }, [provider]);
     
     
-        useEffect(() => {
-            console.log("APPLICATIONID", applicationId);
-            if (!applicationId) {
-                if (!listingId) return;
-                firebaseQuery.getDocsWhere("applications", [where("status", "not-in", ["approved", "declined"]), where("uid", "==", user.id), where("listingId", "==", listingId)]).then((existingApplication) => {
-                    console.log("EXISTING", existingApplication);
-                    // get uploaded files
-                    if (existingApplication && Object.keys(existingApplication).length) {
-                        setFApplication(Object.values(existingApplication)[0]);
-                        setFApplicationId(Object.keys(existingApplication)[0]);
-                    }
-                });
-                return;
-            }
-            if (applicationId) {
-                setFApplicationId(applicationId);
-                if (application) {
-                    let applicationWithoutAdditionalData = {...(application || {})} as any;
-                    delete applicationWithoutAdditionalData.listing;
-                    delete applicationWithoutAdditionalData.address;
-                    delete applicationWithoutAdditionalData.provider;
-                    setFApplication(applicationWithoutAdditionalData);
-                } else {
-                    firebaseQuery.getDocData(["applications", applicationId]).then(setFApplication);
-                }
-            }
-        }, [application, applicationId]);
-
-        const getCurrentStage = async (stage: number): Promise<{
-            stage: ApplicantStage; completedSections: {
-                submitted?: string | undefined;
-                filesViewed?: string[] | undefined;
-                formsCompleted?: {
-                    [key: string]: unknown;
-                } | undefined;
-                filesUploaded?: {
-                    [key: number]: string[];
-                } | undefined;
-            };
-        }> => {
-            console.log("fLSITING CURRENT STAGE", fListing);
-            if (!fListing) throw new Error("Listing deleted");
-            if (!fListing?.applicantWorkflowId) throw new Error("No workflow stage");
-
-            const mApplicantWorkflow = (await firebaseQuery.getDocData(["applicantWorkflows", fListing.applicantWorkflowId]) as ApplicantWorkflow);
-
-            const stageObj = mApplicantWorkflow?.workflow?.find((s) => s.id === stage);
-
-            if (!stageObj) throw new Error("Can't find stage.");
-
-            const applicantFiles = stageObj.files ? Object.fromEntries(await Promise.all(stageObj.files?.map(async (fileId) => {
-                const file = await firebaseQuery.getDocData(["files", fileId]);
-                file.url = await getDownloadURL(ref(storage, `providers/${mApplicantWorkflow?.oId}/${file.fileName}`));
-
-                return [fileId, file];
-            }))) : [];
-            const applicantForms = stageObj.forms ? Object.fromEntries(await Promise.all(stageObj.forms?.map(async (formId) => {
-                return [formId, await firebaseQuery.getDocData(["forms", formId])];
-            }))) : [];
-
-            stageObj.viewableFiles = applicantFiles;
-            stageObj.formDetails = applicantForms;
+//         useEffect(() => {
+//             console.log("APPLICATIONID", applicationId);
+//             if (!applicationId) {
+//                 if (!listingId) return;
+//                 firebaseQuery.getDocsWhere("applications", [where("status", "not-in", ["approved", "declined"]), where("uid", "==", user.id), where("listingId", "==", listingId)]).then((existingApplication) => {
+//                     console.log("EXISTING", existingApplication);
+//                     // get uploaded files
+//                     if (existingApplication && Object.keys(existingApplication).length) {
+//                         setFApplication(Object.values(existingApplication)[0]);
+//                         setFApplicationId(Object.keys(existingApplication)[0]);
+//                     }
+//                 });
+//                 return;
+//             }
+//             if (applicationId) {
+//                 setFApplicationId(applicationId);
+//                 if (application) {
+//                     let applicationWithoutAdditionalData = {...(application || {})} as any;
+//                     delete applicationWithoutAdditionalData.listing;
+//                     delete applicationWithoutAdditionalData.address;
+//                     delete applicationWithoutAdditionalData.provider;
+//                     setFApplication(applicationWithoutAdditionalData);
+//                 } else {
+//                     firebaseQuery.getDocData(["applications", applicationId]).then(setFApplication);
+//                 }
+//             }
+//         }, [application, applicationId]);
+
+//         const getCurrentStage = async (stage: number): Promise<{
+//             stage: ApplicantStage; completedSections: {
+//                 submitted?: string | undefined;
+//                 filesViewed?: string[] | undefined;
+//                 formsCompleted?: {
+//                     [key: string]: unknown;
+//                 } | undefined;
+//                 filesUploaded?: {
+//                     [key: number]: string[];
+//                 } | undefined;
+//             };
+//         }> => {
+//             console.log("fLSITING CURRENT STAGE", fListing);
+//             if (!fListing) throw new Error("Listing deleted");
+//             if (!fListing?.applicantWorkflowId) throw new Error("No workflow stage");
+
+//             const mApplicantWorkflow = (await firebaseQuery.getDocData(["applicantWorkflows", fListing.applicantWorkflowId]) as ApplicantWorkflow);
+
+//             const stageObj = mApplicantWorkflow?.workflow?.find((s) => s.id === stage);
+
+//             if (!stageObj) throw new Error("Can't find stage.");
+
+//             const applicantFiles = stageObj.files ? Object.fromEntries(await Promise.all(stageObj.files?.map(async (fileId) => {
+//                 const file = await firebaseQuery.getDocData(["files", fileId]);
+//                 file.url = await getDownloadURL(ref(storage, `providers/${mApplicantWorkflow?.oId}/${file.fileName}`));
+
+//                 return [fileId, file];
+//             }))) : [];
+//             const applicantForms = stageObj.forms ? Object.fromEntries(await Promise.all(stageObj.forms?.map(async (formId) => {
+//                 return [formId, await firebaseQuery.getDocData(["forms", formId])];
+//             }))) : [];
+
+//             stageObj.viewableFiles = applicantFiles;
+//             stageObj.formDetails = applicantForms;
             
-            return {stage: stageObj, completedSections: fApplication?.completedSections?.[stage] || {}};
-        };
+//             return {stage: stageObj, completedSections: fApplication?.completedSections?.[stage] || {}};
+//         };
     
-        useEffect(() => {
-            const getUploadedFiles = async () => {
-                if (!fApplication.completedSections) {
-                    setUploadedFiles({});
-                    return
-                };
+//         useEffect(() => {
+//             const getUploadedFiles = async () => {
+//                 if (!fApplication.completedSections) {
+//                     setUploadedFiles({});
+//                     return
+//                 };
                 
-                const fileIds = Object.values(fApplication.completedSections)
-                    .flatMap(stageData =>
-                    Object.values(stageData.filesUploaded || {}).flatMap(fileIds => fileIds)
-                    );
+//                 const fileIds = Object.values(fApplication.completedSections)
+//                     .flatMap(stageData =>
+//                     Object.values(stageData.filesUploaded || {}).flatMap(fileIds => fileIds)
+//                     );
                 
-                const fileDataPromises = fileIds.map(async (fileId) => {
-                    const fileData = await firebaseQuery.getDocData(["files", fileId]) as FileItem;
-                    fileData.url = await getDownloadURL(ref(storage, `userFiles/${fileData.fileName}`));
+//                 const fileDataPromises = fileIds.map(async (fileId) => {
+//                     const fileData = await firebaseQuery.getDocData(["files", fileId]) as FileItem;
+//                     fileData.url = await getDownloadURL(ref(storage, `userFiles/${fileData.fileName}`));
                 
-                    return [fileId, fileData] as [string, FileItem]
-                });
+//                     return [fileId, fileData] as [string, FileItem]
+//                 });
                 
-                const fileDataArray = await Promise.all(fileDataPromises);
-                const fileDataObj = Object.fromEntries(fileDataArray)
-                setUploadedFiles(fileDataObj)
-            }
-
-            const addApplication = async () => {
-                console.log("ADDING APPLICATION");
-                if (!fListing || !fListing?.id || !fProvider?.id || !student?.id) return;
-
-                const applicationData = {
-                    uid: student.id,
-                    listingId: fListing?.id,
-                    addressId: fListing.addressId,
-                    applicantWorkflowId: fListing?.applicantWorkflowId,
-                    providerId: fProvider.id,
-                    stage: 1,
-                    status: "draft",
-                    created: (new Date()).toISOString(),
-                    ...fApplication,
-                } as Partial<Application>;
-                const mApplicationId = (await firebaseQuery.add(["applications"], applicationData)).id;
-                console.log("APPLICATION ADDED");
-                setFApplicationId(mApplicationId);
-                setFApplication(applicationData);
-                setDraftSaved(true);
-                return;
-            };
-            getUploadedFiles();
-
-            console.log("Checking IDs");
-
-            if (!fListing || !fListing?.id || !fProvider?.id || !student?.id) return;
-            if (user.product === "providers") return;
-
-            console.log("Checking dates and sections");
-            if (!fApplication.completedSections && !fApplication.startDate && !fApplication.endDate) return;
-
-            console.log("Application updated");
-            if (!fApplicationId && !applicationId) {
-                // save new
-                console.log("Add application")
-                addApplication();
-                return;
-            }
-            // update
-            firebaseQuery.update(["applications", (fApplicationId || applicationId) as string], fApplication);
-            setDraftSaved(true);
-        }, [fApplication]);
+//                 const fileDataArray = await Promise.all(fileDataPromises);
+//                 const fileDataObj = Object.fromEntries(fileDataArray)
+//                 setUploadedFiles(fileDataObj)
+//             }
+
+//             const addApplication = async () => {
+//                 console.log("ADDING APPLICATION");
+//                 if (!fListing || !fListing?.id || !fProvider?.id || !student?.id) return;
+
+//                 const applicationData = {
+//                     uid: student.id,
+//                     listingId: fListing?.id,
+//                     addressId: fListing.addressId,
+//                     applicantWorkflowId: fListing?.applicantWorkflowId,
+//                     providerId: fProvider.id,
+//                     stage: 1,
+//                     status: "draft",
+//                     created: (new Date()).toISOString(),
+//                     ...fApplication,
+//                 } as Partial<Application>;
+//                 const mApplicationId = (await firebaseQuery.add(["applications"], applicationData)).id;
+//                 console.log("APPLICATION ADDED");
+//                 setFApplicationId(mApplicationId);
+//                 setFApplication(applicationData);
+//                 setDraftSaved(true);
+//                 return;
+//             };
+//             getUploadedFiles();
+
+//             console.log("Checking IDs");
+
+//             if (!fListing || !fListing?.id || !fProvider?.id || !student?.id) return;
+//             if (user.product === "providers") return;
+
+//             console.log("Checking dates and sections");
+//             if (!fApplication.completedSections && !fApplication.startDate && !fApplication.endDate) return;
+
+//             console.log("Application updated");
+//             if (!fApplicationId && !applicationId) {
+//                 // save new
+//                 console.log("Add application")
+//                 addApplication();
+//                 return;
+//             }
+//             // update
+//             firebaseQuery.update(["applications", (fApplicationId || applicationId) as string], fApplication);
+//             setDraftSaved(true);
+//         }, [fApplication]);
     
-        const openSuccessPopup = (type: "submitted"|"draftSaved"|"stageComplete"|"outcome") => {
-            setSuccessPopup(type);
-            setTimeout(() => {
-                // onClose();
-            }, 1500);
-        };
+//         const openSuccessPopup = (type: "submitted"|"draftSaved"|"stageComplete"|"outcome") => {
+//             setSuccessPopup(type);
+//             setTimeout(() => {
+//                 // onClose();
+//             }, 1500);
+//         };
 
-        useEffect(() => {
+//         useEffect(() => {
 
-            const areStagesCompleted = async ():Promise<boolean|undefined> => {
-                if (!fListing) return;
-                if (fApplication.stage === undefined) return undefined;
-                const currentStage = await getCurrentStage(fApplication.stage);
+//             const areStagesCompleted = async ():Promise<boolean|undefined> => {
+//                 if (!fListing) return;
+//                 if (fApplication.stage === undefined) return undefined;
+//                 const currentStage = await getCurrentStage(fApplication.stage);
 
-                console.log("Checking current stage is complete");
+//                 console.log("Checking current stage is complete");
                 
-                for (const fileViewed of currentStage.stage?.files || []) {
-                    console.log("Checking file viewed", fileViewed, "in", currentStage?.completedSections?.filesViewed);
-                    if (!currentStage?.completedSections?.filesViewed?.includes(fileViewed)) {        
-                        console.log("File not viewed");
-                        return false;
-                    } else {
-                        console.log("File viewed");
-                    }
-                }
-                for (const formCompleted of currentStage?.stage?.forms || []) {
-                    console.log("Checking form completed", formCompleted, "in", currentStage?.completedSections?.formsCompleted);
-
-                    if (!Object.keys(currentStage?.completedSections?.formsCompleted || {}).includes(formCompleted)) {
-                        console.log("Form not completed");
-                        return false;
-                    } else {
-                        console.log("Form completed")
-                    }
-                }
-                for (let i = 0; i++; i < (currentStage?.stage?.requiredFiles || []).length) {
-                    if (!Object.keys(currentStage?.completedSections?.filesUploaded || {}).includes(i.toString())) {
-                        console.log("Form not uploaded");
-                        return false;
-                    } else {
-                    console.log("Form uploaded");
-                    }
-                }
+//                 for (const fileViewed of currentStage.stage?.files || []) {
+//                     console.log("Checking file viewed", fileViewed, "in", currentStage?.completedSections?.filesViewed);
+//                     if (!currentStage?.completedSections?.filesViewed?.includes(fileViewed)) {        
+//                         console.log("File not viewed");
+//                         return false;
+//                     } else {
+//                         console.log("File viewed");
+//                     }
+//                 }
+//                 for (const formCompleted of currentStage?.stage?.forms || []) {
+//                     console.log("Checking form completed", formCompleted, "in", currentStage?.completedSections?.formsCompleted);
+
+//                     if (!Object.keys(currentStage?.completedSections?.formsCompleted || {}).includes(formCompleted)) {
+//                         console.log("Form not completed");
+//                         return false;
+//                     } else {
+//                         console.log("Form completed")
+//                     }
+//                 }
+//                 for (let i = 0; i++; i < (currentStage?.stage?.requiredFiles || []).length) {
+//                     if (!Object.keys(currentStage?.completedSections?.filesUploaded || {}).includes(i.toString())) {
+//                         console.log("Form not uploaded");
+//                         return false;
+//                     } else {
+//                     console.log("Form uploaded");
+//                     }
+//                 }
                 
-                return true;
-            };
+//                 return true;
+//             };
 
-            areStagesCompleted().then(setCurrentStageComplete);
-        }, [fApplication, fListing])
+//             areStagesCompleted().then(setCurrentStageComplete);
+//         }, [fApplication, fListing])
 
-        const viewFile = (file: string, onOpen: (url: string) => void) => {
-            if (fApplication.reqUserType !== user.userType) return;
-            if (fApplication.stage === undefined) throw new Error("Missing applciation stage.")
-            if (!fListing) throw new Error("No associated listing.");
+//         const viewFile = (file: string, onOpen: (url: string) => void) => {
+//             if (fApplication.reqUserType !== user.userType) return;
+//             if (fApplication.stage === undefined) throw new Error("Missing applciation stage.")
+//             if (!fListing) throw new Error("No associated listing.");
 
-            const viewableFiles = fListing?.applicantWorkflow?.find((stage) => stage.id === fApplication.stage)?.viewableFiles;
+//             const viewableFiles = fListing?.applicantWorkflow?.find((stage) => stage.id === fApplication.stage)?.viewableFiles;
 
-            setFApplication((a) => {
-                const oldA = {...a};
-                const viewedFiles = a.completedSections?.[1]?.filesViewed || [];
-                if (viewedFiles?.includes(file)) return a;
+//             setFApplication((a) => {
+//                 const oldA = {...a};
+//                 const viewedFiles = a.completedSections?.[1]?.filesViewed || [];
+//                 if (viewedFiles?.includes(file)) return a;
     
-                viewableFiles?.[file].url && onOpen(viewableFiles?.[file].url);
-                viewedFiles?.push(file);
+//                 viewableFiles?.[file].url && onOpen(viewableFiles?.[file].url);
+//                 viewedFiles?.push(file);
     
-                const newA = editNestedObject(["completedSections", 1, "filesViewed"], oldA, viewedFiles) as Partial<Application>;
-                return newA;
-            });
-        };
-
-        const addFile = (files: string[], fileId: number) => {
-            if (fApplication.reqUserType !== user.userType) throw new Error(`Incorrect user type. Expected ${fApplication.reqUserType}, got: ${user.userType}`);
-            if (fApplication.stage === undefined) throw new Error("Missing applciation stage.")
-
-            if (!files.length) throw new Error("No files to upload");
-            setFApplication((a) => editNestedObject(["completedSections", fApplication.stage as number, "filesUploaded", fileId], a, files) as Application);
-        };
-
-        const setFormComplete = (formId: string, e: {[key: string]: unknown}) => {
-            if (fApplication.reqUserType !== user.userType) throw new Error(`Incorrect user type. Expected ${fApplication.reqUserType}, got: ${user.userType}`);
-            if (fApplication.stage === undefined) throw new Error("Missing applciation stage.")
-            setFApplication((a) => editNestedObject(["completedSections", fApplication.stage as number, "formsCompleted", formId], a, e) as Application);
-        };
+//                 const newA = editNestedObject(["completedSections", 1, "filesViewed"], oldA, viewedFiles) as Partial<Application>;
+//                 return newA;
+//             });
+//         };
+
+//         const addFile = (files: string[], fileId: number) => {
+//             if (fApplication.reqUserType !== user.userType) throw new Error(`Incorrect user type. Expected ${fApplication.reqUserType}, got: ${user.userType}`);
+//             if (fApplication.stage === undefined) throw new Error("Missing applciation stage.")
+
+//             if (!files.length) throw new Error("No files to upload");
+//             setFApplication((a) => editNestedObject(["completedSections", fApplication.stage as number, "filesUploaded", fileId], a, files) as Application);
+//         };
+
+//         const setFormComplete = (formId: string, e: {[key: string]: unknown}) => {
+//             if (fApplication.reqUserType !== user.userType) throw new Error(`Incorrect user type. Expected ${fApplication.reqUserType}, got: ${user.userType}`);
+//             if (fApplication.stage === undefined) throw new Error("Missing applciation stage.")
+//             setFApplication((a) => editNestedObject(["completedSections", fApplication.stage as number, "formsCompleted", formId], a, e) as Application);
+//         };
     
-        const successText = {
-            submitted: {
-                title: "Application submitted",
-                desc: "We've sent your application to the placement provider. You will hear what the next steps are soon.",
-            },
-            draftSaved: {
-                title: "Draft saved",
-                desc: "Your draft has been saved. Go to the 'Applications' section from your home screen to edit.",
-            },
-            stageComplete: {
-                title: "Stage complete",
-                desc: "We have sent this to the next stage in the application process. We will update you with any progress.",
-            },
-            outcome: {
-                title: "Outcome submitted",
-                desc: "We have sent the student an email with the outcome of their application.",
-            },
-        };
-
-        const onFApply = async (draft?: boolean) => {
-            if (draft) {
-                openSuccessPopup("draftSaved")
-                return;
-            }
-
-            if (!fApplicationId) return;
+//         const successText = {
+//             submitted: {
+//                 title: "Application submitted",
+//                 desc: "We've sent your application to the placement provider. You will hear what the next steps are soon.",
+//             },
+//             draftSaved: {
+//                 title: "Draft saved",
+//                 desc: "Your draft has been saved. Go to the 'Applications' section from your home screen to edit.",
+//             },
+//             stageComplete: {
+//                 title: "Stage complete",
+//                 desc: "We have sent this to the next stage in the application process. We will update you with any progress.",
+//             },
+//             outcome: {
+//                 title: "Outcome submitted",
+//                 desc: "We have sent the student an email with the outcome of their application.",
+//             },
+//         };
+
+//         const onFApply = async (draft?: boolean) => {
+//             if (draft) {
+//                 openSuccessPopup("draftSaved")
+//                 return;
+//             }
+
+//             if (!fApplicationId) return;
     
-            // Check all items have been filled in.
-            if (!fApplication.startDate || !fApplication.endDate) throw new Error("Please select dates for your placement.");
+//             // Check all items have been filled in.
+//             if (!fApplication.startDate || !fApplication.endDate) throw new Error("Please select dates for your placement.");
     
-            await executeCallable("applications-submit", {applicationId: fApplicationId});
+//             await executeCallable("applications-submit", {applicationId: fApplicationId});
             
-            const newApplication = await firebaseQuery.getDocData(["applications", fApplicationId]) as Application;
-            setFApplication(newApplication);
-            openSuccessPopup("submitted")
-        };
+//             const newApplication = await firebaseQuery.getDocData(["applications", fApplicationId]) as Application;
+//             setFApplication(newApplication);
+//             openSuccessPopup("submitted")
+//         };
     
-        const progressStage = async (type: number|"accept"|"reject", e?: {feedback?: string}) => {
-            // Check all stages completed.
-            if (!fApplicationId) return;
-            if (!currentStageComplete) throw new Error("Complete all forms before submitting.");
-            if (fApplication.reqUserType !== user.userType) throw new Error(`Incorrect user type. Expected ${fApplication.reqUserType}, got: ${user.userType}`);
-            if (fApplication.stage === undefined) throw new Error("Missing applciation stage.")
-
-            await executeCallable("applications-changeStage", {applicationId: fApplicationId, type: type, feedback: e?.feedback});
-            const newApplication = await firebaseQuery.getDocData(["applications", fApplicationId]) as Application;
-            setFApplication(newApplication);
-        };
+//         const progressStage = async (type: number|"accept"|"reject", e?: {feedback?: string}) => {
+//             // Check all stages completed.
+//             if (!fApplicationId) return;
+//             if (!currentStageComplete) throw new Error("Complete all forms before submitting.");
+//             if (fApplication.reqUserType !== user.userType) throw new Error(`Incorrect user type. Expected ${fApplication.reqUserType}, got: ${user.userType}`);
+//             if (fApplication.stage === undefined) throw new Error("Missing applciation stage.")
+
+//             await executeCallable("applications-changeStage", {applicationId: fApplicationId, type: type, feedback: e?.feedback});
+//             const newApplication = await firebaseQuery.getDocData(["applications", fApplicationId]) as Application;
+//             setFApplication(newApplication);
+//         };
     
 
-    return {successText, onFApply, progressStage, currentStageComplete, uploadedFiles, getCurrentStage, setFormComplete, viewFile, addFile, setSuccessPopup, openSuccessPopup, setFApplication, fApplication, draftSaved, profileUrl, successPopup, fApplicationId, fListing, student, fProvider}
-}
+//     return {successText, onFApply, progressStage, currentStageComplete, uploadedFiles, getCurrentStage, setFormComplete, viewFile, addFile, setSuccessPopup, openSuccessPopup, setFApplication, fApplication, draftSaved, profileUrl, successPopup, fApplicationId, fListing, student, fProvider}
+// }
 
 export function useProposePlacementRenderer({user, orgContext, placement}:
     {user:UserData, orgContext?: {details: InstituteData, userGroups: {[key:string]: UserGroupData}, forms: {[key:string]: unknown}, cohorts: {[key:string]: CohortData}},
@@ -2046,11 +1976,9 @@ export function useProposePlacementRenderer({user, orgContext, placement}:
 
     const submitSection = (type:"dates"|"provider"|"address", data:{[key:string]:unknown}) => {
         setFormData((f) => {
-            const { id, ...values } = data
             return {
               ...f,
-              ...values,
-              id: (placement?.placementId || formData?.id) as string
+              ...data
             } as StudentPlacementData;
           });
         if (placement?.placementId && type === "dates") {
@@ -3039,41 +2967,42 @@ function useGenericWorkflowEditor({user, initialData, defaultData, onSubmit}: Ge
         onDeleteArrow, fWorkflowNodes, containerRef, setError, setArrows, setFWorkflowNodes}});
 }
 
-type InstitutePlacementListingUploadParams = {
+type InstituteProviderContactUploadParams = {
     user: UserData,
     onComplete?: () => void
 }
 
-export type InstitutePlacementListingUpload = {
-    provider: string;
-    jobTitle: string;
+export type InstituteProviderContactUpload = {
+    business: string;
+    forename?: string;
+    surname?: string;
     email: string;
     phone?: string;
-    addressOne: string;
-    addressTwo: string;
-    city: string;
-    postcode: string;
-    country: string;
+    addressOne?: string;
+    addressTwo?: string;
+    city?: string;
+    postcode?: string;
+    country?: string;
 };
 
-export function useInstitutePlacementListingHandler({user}: InstitutePlacementListingUploadParams) {
+export function useInstituteProviderContactsHandler({user}: InstituteProviderContactUploadParams) {
     const [emptyCellsWarning, setEmptyCellsWarning] = useState(false);
     const [alert, setAlert] = useState<{severity: "warning"|"error"|"success"|"info", msg: string}>();
 
-    const requiredFields = ["name", "jobTitle", "email", "addressOne", "city", "postCode", "country"];
+    const requiredFields = ["business", "forename", "email"];
     const {execute} = useExecuteCallableJob({user: user});
 
-    const checkData = (placements: InstitutePlacementListingUpload[]) => {
+    const checkData = (providerContacts: InstituteProviderContactUpload[]) => {
         setAlert(undefined);
 
-        placements = placements.filter((u) => Object.entries(u).some(([, v]) => v));
+        providerContacts = providerContacts.filter((u) => Object.entries(u).some(([, v]) => v));
 
-        if (!Object.entries(placements)) {
+        if (!Object.entries(providerContacts)) {
             return [];
         }
-        console.log("P", placements);
+        console.log("P", providerContacts);
 
-        if (placements.filter((u) => u.email).length < placements.length) {
+        if (providerContacts.filter((u) => u.email).length < providerContacts.length) {
             setAlert({msg: "Your data contains missing email addresses.", severity: "error"});
             return false;
         }
@@ -3081,18 +3010,18 @@ export function useInstitutePlacementListingHandler({user}: InstitutePlacementLi
         let emptyOptionalCell = false;
         let emptyRequiredCell = false;
 
-        for (const placement of placements ) {
-            if (!checkEmailValidity(placement)) {
+        for (const providerContact of providerContacts ) {
+            if (!checkEmailValidity(providerContact)) {
                 return false;
             }
 
-            if (Object.keys(placement).includes("")) {
+            if (Object.keys(providerContact).includes("")) {
                 setAlert({msg: "Data cannot be uploaded in unnamed columns.", severity: "error"});
                 return false;
             }
 
-            for (const field in placement) {
-                if (!placement[field]) {
+            for (const field in providerContact) {
+                if (!providerContact[field]) {
                     if (requiredFields.includes(field)) {
                         setAlert({msg: "All users must contain "+requiredFields.join(", "), severity: "error"});
                         emptyRequiredCell = true;
@@ -3113,44 +3042,30 @@ export function useInstitutePlacementListingHandler({user}: InstitutePlacementLi
         } else {
             setEmptyCellsWarning(false);
         }
-        return placements;
+        return providerContacts;
     };
 
-    const checkEmailValidity = (placement: InstitutePlacementListingUpload) => {
-        if (!validateEmail(placement.email as string)) {
-            setAlert({msg: `Error in email formatting: ${placement.email}. Amend errors and reupload.`, severity: "error"});
+    const checkEmailValidity = (providerContact: InstituteProviderContactUpload) => {
+        if (!validateEmail(providerContact.email as string)) {
+            setAlert({msg: `Error in email formatting: ${providerContact.email}. Amend errors and reupload.`, severity: "error"});
             return false;
         }
         return true;
     };
 
-    const uploadPlacements = async (placements: InstitutePlacementListingUpload[]) => {
-        let fPlacements:InstitutePlacementListingUpload[] = [];
-        console.log("PP", placements);
+    const uploadProviderContacts = async (providers: InstituteProviderContactUpload[], schoolId?: string) => {
+        let fProviders:InstituteProviderContactUpload[] = [];
+        console.log("PP", providers);
 
-        const cleanUpload = checkData(placements);
+        const cleanUpload = checkData(providers);
         if (!cleanUpload) {
             return false;
         }
-        fPlacements = cleanUpload;
+        fProviders = cleanUpload;
 
         setAlert(undefined);
-        if (fPlacements.length) {
-            const formattedPlacements = fPlacements.map((v) =>
-                ({
-                    name: v.provider,
-                    title: v.jobTitle,
-                    providerEmail: v.email,
-                    providerPhone: v.phone,
-                    ["address-line1"]: v.addressOne,
-                    ["address-line2"]: v.addressTwo,
-                    locality: v.city,
-                    postal_code: v.postcode,
-                    country: v.country,
-                }));
-            console.log("P", placements);
-            console.log("callable params", {placements: formattedPlacements, instituteId: user.product === "admin" ? "admin" : user.oId});
-            execute("placementListing-add", {data: formattedPlacements, instituteId: user.product === "admin" ? "admin" : user.oId});
+        if (fProviders.length) {
+            execute("providerContacts-add", {providerContacts: fProviders, instituteId: user.product === "admin" ? "admin" : user.oId, schoolId: schoolId});
         }
         return true;
     };
@@ -3160,7 +3075,7 @@ export function useInstitutePlacementListingHandler({user}: InstitutePlacementLi
         setEmptyCellsWarning(false);
     };
 
-    return ({...{uploadPlacements, alert, onChange}});
+    return ({...{uploadProviderContacts, alert, onChange}});
 }
 
 
@@ -3175,7 +3090,7 @@ export function useGetIndividualPlacementForPlacementPage({user, placementId, or
     const [disableEmail, setDisableEmail] = useState({parent: false, provider: false});
     const [rejectELIPopup, setRejectELIPopup] = useState(false);
     const [eliPopupOpen, setEliPopupOpen] = useState(false);
-    const [eliURL, setELIURL] = useState("");
+    const [eliData, setELIData] = useState<string>();
 
     const [rejectExternalDocPopup, setRejectExternalDocPopup] = useState<"riskAssessment"|"dbsCheck"|false>(false);
     const [externalDocPopupOpen, setExternalDocPopupOpen] = useState<"riskAssessment"|"dbsCheck"|false>(false);
@@ -3356,10 +3271,10 @@ export function useGetIndividualPlacementForPlacementPage({user, placementId, or
             setShareStudentRequestPopup(true);
         }
         if (e === "noInsurance") {
-            if (!eliURL) {
+            if (!eliData) {
                 const storageRef = ref(storage, `insurance/${placement.providerId}.pdf`);
-                const file = await getDownloadURL(storageRef);
-                setELIURL(file);
+                const file = await getDownloadURL(storageRef).catch(() => placement.insuranceSkippedReason);
+                setELIData(file);
             }
             setEliPopupOpen(true);
         }
@@ -3391,15 +3306,15 @@ export function useGetIndividualPlacementForPlacementPage({user, placementId, or
 
     const approveELI = async () => {
         if (!placement) return;
-        await executeCallable("insurance-approve", {oId: user.oId, providerId: placement.providerId});
+        await executeCallable("insurance-approve", {oId: user.oId, providerContactId: placement.providerContactId});
         setEliPopupOpen(false);
     };
 
     const rejectELI = async ({reason}:{reason: string}) => {
         if (!placement || !institute) return;
 
-        console.log("Reject", {reason: reason, placement: placement, instituteName: institute.name, staffEmail: user.email});
-        await executeCallable("insurance-reject", {reason: reason, placementId: placementId, instituteName: institute.name, staffEmail: user.email});
+        console.log("Reject", {reason: reason, placement: placement, instituteName: institute.name});
+        await executeCallable("insurance-reject", {reason: reason, placementId: placementId, instituteName: institute.name});
         setRejectELIPopup(false);
         setEliPopupOpen(false);
     };
@@ -3420,10 +3335,12 @@ export function useGetIndividualPlacementForPlacementPage({user, placementId, or
     const manuallyConfigureProvider = async () => {
         if (!placement) return;
         if (!placement.providerId) {
-            const res = await executeCallable("placement-uploadProviderDetails", {
-                pId: placementId,
-                placement: Object.fromEntries(Object.entries(placement).filter(([k]) => k !== "contactId")),
-                stage: wStage,
+            const res = await executeCallable("providerContacts-uploadProviderDetails", {
+                placement: {
+                    id: placementId,
+                    data: Object.fromEntries(Object.entries(placement).filter(([k]) => k !== "contactId")),
+                    stage: wStage,
+                },
                 skipSearch: true}).catch((e) => {
                 throw e;
             });
@@ -3447,7 +3364,7 @@ export function useGetIndividualPlacementForPlacementPage({user, placementId, or
         await executeCallable("placement-withdraw", {placementId: placementId});
     }
 
-    return {placement, wStage, student, workflow, editable, withdrawFromPlacementPopup, addOnboardingDocsPopup, setAddOnboardingDocsPopup, dismissOnboardingPopup, setDismissOnboardingPopup, setWithdrawFromPlacementPopup, withdrawFromPlacement, onFlagClick, setUploadInsurance, setUploadProviderDocPopup, setUploadRA, setUploadDBS, onboardingStatus, setSkipStagePopup, onboardingPopup, setViewExternalLinkPopup, setOnboardingPopup, setRejectELIPopup, eliURL, riskAssessmentURL, dbsCheckURL, setExternalLinkCopied, skipStagePopup, snackbar, setSnackbar, cohort, disableEmail, rejectELIPopup, eliPopupOpen, rejectExternalDocPopup, externalDocPopupOpen, viewExternalLinkPopup, externalLinkCopied, uploadInsurance, uploadRA, uploadDBS, editStage, sendEmail, canEdit, approveELI, setEliPopupOpen, uploadProviderDocPopup, rejectELI, setRejectExternalDocPopup, setExternalDocPopupOpen, approveProviderDoc, rejectProviderDoc, manuallyConfigureProvider, institute, shareStudentRequestPopup, setShareStudentRequestPopup}
+    return {placement, wStage, student, workflow, editable, withdrawFromPlacementPopup, addOnboardingDocsPopup, setAddOnboardingDocsPopup, dismissOnboardingPopup, setDismissOnboardingPopup, setWithdrawFromPlacementPopup, withdrawFromPlacement, onFlagClick, setUploadInsurance, setUploadProviderDocPopup, setUploadRA, setUploadDBS, onboardingStatus, setSkipStagePopup, onboardingPopup, setViewExternalLinkPopup, setOnboardingPopup, setRejectELIPopup, eliData, riskAssessmentURL, dbsCheckURL, setExternalLinkCopied, skipStagePopup, snackbar, setSnackbar, cohort, disableEmail, rejectELIPopup, eliPopupOpen, rejectExternalDocPopup, externalDocPopupOpen, viewExternalLinkPopup, externalLinkCopied, uploadInsurance, uploadRA, uploadDBS, editStage, sendEmail, canEdit, approveELI, setEliPopupOpen, uploadProviderDocPopup, rejectELI, setRejectExternalDocPopup, setExternalDocPopupOpen, approveProviderDoc, rejectProviderDoc, manuallyConfigureProvider, institute, shareStudentRequestPopup, setShareStudentRequestPopup}
 }
 
 export function useOnboardingPopup({onboarding, providerId, placementId, user, onClose}:{onboarding: (
@@ -3810,17 +3727,8 @@ export function useLoadListings(user: UserData, queryConstraint?: QueryConstrain
     };
 
     useEffect(() => {
-        let unsubscribe: () => void;
-
-
 
         loadListings();
-
-        return () => {
-            if (unsubscribe) {
-                unsubscribe();  // Unsubscribe from the snapshot listener when the component unmounts
-            }
-        };
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [queryConstraints]);
 
@@ -3911,17 +3819,7 @@ export function useLoadProviderPlacements(user: UserData, queryConstraint?: Quer
     };
 
     useEffect(() => {
-        let unsubscribe: () => void;
-
-
-
         loadListings();
-
-        return () => {
-            if (unsubscribe) {
-                unsubscribe();  // Unsubscribe from the snapshot listener when the component unmounts
-            }
-        };
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [queryConstraints]);
 
@@ -4016,14 +3914,7 @@ export function useLoadApplications({user, applicationType, listingId, queryCons
     };
 
     useEffect(() => {
-        let unsubscribe: () => void;
-
         loadApplications();
-        return () => {
-            if (unsubscribe) {
-                unsubscribe();  // Unsubscribe from the snapshot listener when the component unmounts
-            }
-        };
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [type, queryConstraints]);
 
@@ -4060,7 +3951,7 @@ export type DataViewerPaginater = {
     sorts?: Sorts
 }
 
-export function useDataViewerPaginator({view: initialView, sorts, queryLimit, additionalEntryProcessing, formatItems, snapshot, filters: initialFilters, onSearch, data}:DataViewerPaginater) {
+export function useDataViewerPaginator({view: initialView, sorts, queryLimit=10, additionalEntryProcessing, formatItems, snapshot, filters: initialFilters, onSearch, data}:DataViewerPaginater) {
     const [tableData, setTableData] = useState<{[key:string]:{[key:string]: unknown}}>(Array.isArray(data) ? Object.fromEntries(Object.entries(data).slice(0, queryLimit)) : {});
     const [page, setPage] = useState([1, 0]);
     const [view, setView] = useState(initialView);
@@ -4117,7 +4008,7 @@ export function useDataViewerPaginator({view: initialView, sorts, queryLimit, ad
     const getDataFromQuery = async (
         itemList: {[key: string]: any} = {}, currentQueryAnchor=queryAnchor, cursorDirection?:"increase"|"decrease"|undefined, prevEntries=prevEntryIds, loadMoreFromQuery=false):Promise<any> => {
         
-        if (!filters) return;
+        // if (!filters) return;
         setLoading(true);
         if (!Array.isArray(data)) {
             setTableDataFromDefinedData();
@@ -4287,8 +4178,11 @@ export function useDataViewerPaginator({view: initialView, sorts, queryLimit, ad
                 Object.keys(itemList).length === 0 &&
                 currentQueryAnchor.endQueryPos+1 === data.length &&
                 page[0] > 1) {
-                setTableData({});
+                if (view === "table") {
+                    setTableData({});
+                }
                 setQueryAnchor((a) => ({...a, startKey: ""}));
+                setLoading("loaded");
                 return;
             }
 
@@ -4327,8 +4221,25 @@ export function useDataViewerPaginator({view: initialView, sorts, queryLimit, ad
     }, [filters]);
 
     useEffect(() => {
+        console.log("View reset.")
+        reset();
+    }, [view]);
+
+    useEffect(() => {
+        console.log("search reset.")
         reset();
-    }, [view, searchString, data, sort]);
+    }, [searchString]);
+
+    useEffect(() => {
+        console.log("data reset.")
+        reset();
+    }, [data]);
+
+    useEffect(() => {
+        console.log("sort reset.")
+        reset();
+    }, [sort]);
+
 
     // Fetch new data when queries or page change
     useEffect(() => {