Use server side props to get integration data

pull/2/head
Bailey Pumfleet 2021-03-30 14:23:51 +01:00
parent f6c50106bd
commit d82dc10d74
1 changed files with 30 additions and 13 deletions

View File

@ -1,11 +1,11 @@
import Head from 'next/head';
import prisma from '../lib/prisma';
import Shell from '../components/Shell';
import { useState } from 'react';
import { useSession, getSession } from 'next-auth/client';
export default function Home() {
export default function Home(props) {
const [session, loading] = useSession();
const [integrations, setIntegrations] = useState([]);
const [showAddModal, setShowAddModal] = useState(false);
if (loading) {
@ -16,15 +16,6 @@ export default function Home() {
}
}
function getIntegrations() {
fetch('/api/integrations')
.then((response) => response.json())
.then((data) => setIntegrations(data));
}
// TODO: Stop this function from running repeatedly
getIntegrations()
function toggleAddModal() {
setShowAddModal(!showAddModal);
}
@ -45,7 +36,7 @@ export default function Home() {
<Shell heading="Integrations">
<div className="bg-white shadow overflow-hidden sm:rounded-lg">
<ul className="divide-y divide-gray-200">
{integrations.map((integration) =>
{props.credentials.map((integration) =>
<li>
<a href="#" className="block hover:bg-gray-50">
<div className="flex items-center px-4 py-4 sm:px-6">
@ -95,7 +86,7 @@ export default function Home() {
</li>
)}
</ul>
{integrations.length == 0 &&
{props.credentials.length == 0 &&
<div className="bg-white shadow sm:rounded-lg">
<div className="flex">
<div className="py-9 pl-8">
@ -191,4 +182,30 @@ export default function Home() {
</Shell>
</div>
);
}
export async function getServerSideProps(context) {
const session = await getSession(context);
const user = await prisma.user.findFirst({
where: {
email: session.user.email,
},
select: {
id: true
}
});
const credentials = await prisma.credential.findMany({
where: {
userId: user.id,
},
select: {
type: true,
key: true
}
});
return {
props: {credentials}, // will be passed to the page component as props
}
}