chore: add load more functionality, with refactored css

This commit is contained in:
Matilda Landström
2024-04-26 10:51:05 +02:00
parent 204f0f45ce
commit 7480b212e2
31 changed files with 326 additions and 169 deletions

View File

@@ -1,11 +1,6 @@
import { z } from "zod"
import * as api from "@/lib/api"
import {
benefits,
extendedUser,
nextLevelPerks,
previousStays,
upcomingStays,
} from "./temp"
import {
badRequestError,
forbiddenError,
@@ -13,9 +8,15 @@ import {
unauthorizedError,
} from "@/server/errors/trpc"
import { protectedProcedure, router } from "@/server/trpc"
import { z } from "zod"
import { getUserSchema } from "./output"
import {
benefits,
extendedUser,
nextLevelPerks,
previousStays,
upcomingStays,
} from "./temp"
function fakingRequest<T>(payload: T): Promise<T> {
return new Promise((resolve) => {
@@ -34,7 +35,6 @@ export const userQueryRouter = router({
Authorization: `Bearer ${ctx.session.token.access_token}`,
},
})
if (!apiResponse.ok) {
switch (apiResponse.status) {
case 400:
@@ -67,7 +67,7 @@ export const userQueryRouter = router({
name: `${verifiedData.data.name} ${verifiedData.data.lastName}`,
}
} catch (error) {
console.info(`GEt User Error`)
console.info(`Get User Error`)
console.error(error)
throw internalServerError()
}
@@ -90,25 +90,74 @@ export const userQueryRouter = router({
.object({
perPage: z.number().min(0).default(6),
page: z.number().min(0).default(0),
cursor: z.number().nullish(),
})
.default({})
)
.query(async (opts) => {
const { perPage, page } = opts.input
return previousStays.slice(page * perPage, page * perPage + perPage)
const { perPage, page, cursor } = opts.input
let nextCursor: typeof cursor | undefined = undefined
const nrPages = Math.ceil(previousStays.length / perPage)
let stays, nextPage
if (cursor) {
stays = previousStays.slice(cursor, perPage + cursor + 1)
nextPage = cursor / perPage + 1
} else {
stays = previousStays.slice(
page * perPage,
page * perPage + perPage + 1
)
}
if (
(nextPage && nextPage < nrPages && stays.length == perPage + 1) ||
(!nextPage && nrPages > 1)
) {
const nextItem = stays.pop()
if (nextItem) {
nextCursor = previousStays.indexOf(nextItem)
}
} // TODO: Make request to get user data from Scandic API
return { data: stays, nextCursor }
}),
upcoming: protectedProcedure
.input(
z
.object({
perPage: z.number().min(0).default(6),
page: z.number().min(0).default(0),
cursor: z.number().nullish(),
})
.default({})
)
.query(async (opts) => {
const { perPage, page } = opts.input
return upcomingStays.slice(page * perPage, page * perPage + perPage)
const { perPage, page, cursor } = opts.input
let nextCursor: typeof cursor | undefined = undefined
const nrPages = Math.ceil(upcomingStays.length / perPage)
let stays, nextPage
if (cursor) {
stays = upcomingStays.slice(cursor, perPage + cursor + 1)
nextPage = cursor / perPage + 1
} else {
stays = upcomingStays.slice(
page * perPage,
page * perPage + perPage + 1
)
}
if (
(nextPage && nextPage < nrPages && stays.length == perPage + 1) ||
(!nextPage && nrPages > 1)
) {
const nextItem = stays.pop()
if (nextItem) {
nextCursor = upcomingStays.indexOf(nextItem)
}
} // TODO: Make request to get user data from Scandic API
return { data: stays, nextCursor }
}),
}),
})

View File

@@ -1,3 +1,5 @@
import { randomUUID } from "crypto"
import { dt } from "@/lib/dt"
export const benefits = [
@@ -115,168 +117,182 @@ export const shortcuts = [
export const previousStays = [
{
uid: "0",
uid: randomUUID(),
dateArrive: new Date("04 27 2024"),
dateDepart: new Date("04 28 2024"),
guests: 2,
hotel: "Scandic Helsinki Hub",
},
{
uid: "1",
uid: randomUUID(),
dateArrive: new Date("05 27 2024"),
dateDepart: new Date("05 28 2024"),
guests: 2,
hotel: "Scandic Örebro Central",
},
{
uid: "2",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Oslo City",
},
{
uid: "3",
uid: randomUUID(),
dateArrive: new Date("04 27 2024"),
dateDepart: new Date("04 28 2024"),
guests: 2,
hotel: "Scandic Lorem",
},
{
uid: "4",
uid: randomUUID(),
dateArrive: new Date("05 27 2024"),
dateDepart: new Date("05 28 2024"),
guests: 2,
hotel: "Scandic Ipsum",
},
{
uid: "5",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Dolor Sin Amet",
},
{
uid: "6",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Anglais",
},
{
uid: "7",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Park",
},
{
uid: "8",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Klara",
},
{
uid: "9",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Dolor A",
hotel: "Scandic Järva Krog",
},
{
uid: "10",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic B",
hotel: "Scandic Kiruna",
},
{
uid: "11",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic C",
},
{
uid: "12",
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic D",
},
{
uid: "13",
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic E",
},
{
uid: "14",
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic F",
},
{
uid: "15",
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic G",
hotel: "Scandic Umeå",
},
]
export const upcomingStays = [
{
uid: "0",
uid: randomUUID(),
dateArrive: new Date("04 27 2024"),
dateDepart: new Date("04 28 2024"),
guests: 2,
hotel: "Scandic Helsinki Hub",
},
{
uid: "1",
uid: randomUUID(),
dateArrive: new Date("05 27 2024"),
dateDepart: new Date("05 28 2024"),
guests: 2,
hotel: "Scandic Örebro Central",
},
{
uid: "2",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Oslo City",
},
{
uid: "3",
uid: randomUUID(),
dateArrive: new Date("04 27 2024"),
dateDepart: new Date("04 28 2024"),
guests: 2,
hotel: "Scandic Lorem",
},
{
uid: "4",
uid: randomUUID(),
dateArrive: new Date("05 27 2024"),
dateDepart: new Date("05 28 2024"),
guests: 2,
hotel: "Scandic Ipsum",
},
{
uid: "5",
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Dolor Sin Amet",
},
{
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Anglais",
},
{
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Park",
},
{
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Klara",
},
{
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Järva Krog",
},
{
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Kiruna",
},
{
uid: randomUUID(),
dateArrive: new Date("06 27 2024"),
dateDepart: new Date("06 28 2024"),
guests: 2,
hotel: "Scandic Umeå",
},
]
export const extendedUser = {
dob: dt("1977-07-05").format("YYYY-MM-DD"),
journeys: challenges.journeys,
nights: 14,
shortcuts,
upcomingStays,
victories: challenges.victories,
}