rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-19 04:19:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: use swr for collections

Browse source
This commit is contained in:
swve 2023-01-24 22:31:38 +01:00
parent 007ed6c8ea
commit 7ff7931821
3 changed files with 14 additions and 64 deletions
Download patch file Download diff file Expand all files Collapse all files

2
front/app/_orgs/[orgslug]/activity/page.tsx
View file

@ -1,7 +1,5 @@
"use client"; "use client";
import { getAPIUrl, getBackendUrl } from "@services/config"; import { getAPIUrl, getBackendUrl } from "@services/config";
import { getActivities } from "@services/courses/activity";
import { getOrganizationContextInfo } from "@services/orgs";
import { swrFetcher } from "@services/utils/requests"; import { swrFetcher } from "@services/utils/requests";
import React from "react"; import React from "react";
import { styled } from "styled-components"; import { styled } from "styled-components";

34
front/app/_orgs/[orgslug]/collections/page.tsx
View file

@ -1,39 +1,22 @@
"use client"; "use client";
import Layout from "../../../../components/UI/Layout";
import Link from "next/link"; import Link from "next/link";
import { useRouter } from "next/router";
import React from "react"; import React from "react";
import styled from "styled-components"; import styled from "styled-components";
import { Title } from "../../../../components/UI/Elements/Styles/Title"; import { Title } from "@components/UI/Elements/Styles/Title";
import { deleteCollection, getOrgCollections } from "../../../../services/collections"; import { deleteCollection } from "@services/collections";
import { getOrganizationContextInfo } from "../../../../services/orgs"; import { getAPIUrl, getBackendUrl } from "@services/config";
import { getBackendUrl } from "../../../../services/config"; import { swrFetcher } from "@services/utils/requests";
import useSWR, { mutate } from "swr";
function Collections(params: any) { function Collections(params: any) {
const orgslug = params.params.orgslug; const orgslug = params.params.orgslug;
const { data: collections, error: error } = useSWR(`${getAPIUrl()}collections/page/1/limit/10`, swrFetcher);
const [isLoading, setIsLoading] = React.useState(true);
const [collections, setCollections] = React.useState([]);
async function fetchCollections() {
setIsLoading(true);
const org = await getOrganizationContextInfo(orgslug);
const collections = await getOrgCollections(org.org_id);
setCollections(collections);
setIsLoading(false);
}
async function deleteCollectionAndFetch(collectionId: number) { async function deleteCollectionAndFetch(collectionId: number) {
setIsLoading(true);
await deleteCollection(collectionId); await deleteCollection(collectionId);
await fetchCollections(); mutate(`${getAPIUrl()}collections/page/1/limit/10`);
setIsLoading(false);
} }
React.useEffect(() => {
fetchCollections();
}, []);
return ( return (
<> <>
<Title> <Title>
@ -42,7 +25,8 @@ function Collections(params:any) {
<button>+</button> <button>+</button>
</Link>{" "} </Link>{" "}
</Title> </Title>
{isLoading ? ( {error && <p>Failed to load</p>}
{!collections ? (
<div>Loading...</div> <div>Loading...</div>
) : ( ) : (
<div> <div>

40
front/services/collections.ts
View file

@ -1,41 +1,9 @@
import { getAPIUrl } from "./config"; import { getAPIUrl } from "./config";
export async function getOrgCollections(org_slug: any) { /*
const HeadersConfig = new Headers({ "Content-Type": "application/json" }); This file includes only POST, PUT, DELETE requests
GET requests are called from the frontend using SWR (https://swr.vercel.app/)
const requestOptions: any = { */
method: "GET",
headers: HeadersConfig,
redirect: "follow",
credentials: "include",
};
return fetch(`${getAPIUrl()}collections/page/1/limit/10`, requestOptions)
.then((result) => result.json())
.catch((error) => console.log("error", error));
}
export async function getCollection(collection_slug: any) {
const HeadersConfig = new Headers({ "Content-Type": "application/json" });
const requestOptions: any = {
method: "GET",
headers: HeadersConfig,
redirect: "follow",
credentials: "include",
};
return fetch(
`${getAPIUrl()}collections/${collection_slug}`,
requestOptions
)
.then((result) => result.json())
.catch((error) => console.log("error", error));
}
export async function deleteCollection(collection_id: any) { export async function deleteCollection(collection_id: any) {
const HeadersConfig = new Headers({ "Content-Type": "application/json" }); const HeadersConfig = new Headers({ "Content-Type": "application/json" });