1
1
import React from 'react' ;
2
2
import Head from 'next/head' ;
3
- import { GetStaticPropsResult } from 'next' ;
3
+ import { GetServerSidePropsContext , InferGetServerSidePropsType } from 'next' ;
4
4
import Image from 'next/image' ;
5
5
import TimeAgo from 'javascript-time-ago' ;
6
- import { compact } from 'lodash' ;
7
6
import { Title , Container , Text , Grid , Link , Card } from '@components' ;
8
7
9
8
import en from 'javascript-time-ago/locale/en.json' ;
@@ -13,18 +12,9 @@ import { getBookmarks } from '../notion';
13
12
TimeAgo . addDefaultLocale ( en ) ;
14
13
const timeAgo = new TimeAgo ( 'en-US' ) ;
15
14
16
- export interface Bookmark {
17
- id : string ;
18
- created : string ;
19
- name : string ;
20
- url : string ;
21
- }
22
-
23
- interface BookmarksProps {
24
- bookmarks : ReadonlyArray < Bookmark > ;
25
- }
26
-
27
- const Bookmarks = ( { bookmarks } : BookmarksProps ) : JSX . Element => (
15
+ const Bookmarks = ( {
16
+ bookmarks,
17
+ } : InferGetServerSidePropsType < typeof getServerSideProps > ) : JSX . Element => (
28
18
< Container marginBottom = "5rem" >
29
19
< Head >
30
20
< title > Bookmarks</ title >
@@ -90,34 +80,50 @@ const Bookmarks = ({ bookmarks }: BookmarksProps): JSX.Element => (
90
80
</ Container >
91
81
) ;
92
82
83
+ export interface Bookmark {
84
+ id : string ;
85
+ created : string ;
86
+ name : string ;
87
+ url : string ;
88
+ }
89
+
93
90
const formatBookmarks = ( {
94
91
results,
95
92
} : QueryDatabaseResponse ) : ReadonlyArray < Bookmark > =>
96
- compact (
97
- results . map ( ( result ) => {
98
- if (
99
- result . object === 'page' &&
100
- 'url' in result &&
101
- result . properties ?. Created ?. type === 'created_time' &&
102
- result . properties ?. URL ?. type == 'url' &&
103
- result . properties . URL . url &&
104
- result . properties ?. Name ?. type == 'title' &&
105
- result . properties . Name . title ?. [ 0 ] ?. type === 'text'
106
- ) {
107
- return {
93
+ results . reduce < Array < Bookmark > > ( ( acc , result ) => {
94
+ if (
95
+ result . object === 'page' &&
96
+ 'url' in result &&
97
+ result . properties ?. Created ?. type === 'created_time' &&
98
+ result . properties ?. URL ?. type == 'url' &&
99
+ result . properties . URL . url &&
100
+ result . properties ?. Name ?. type == 'title' &&
101
+ result . properties . Name . title ?. [ 0 ] ?. type === 'text'
102
+ ) {
103
+ return [
104
+ ...acc ,
105
+ {
108
106
id : result . id ,
109
107
url : result . properties . URL . url ,
110
108
created : result . properties . Created . created_time ,
111
109
name : result . properties . Name . title [ 0 ] . plain_text ,
112
- } ;
113
- }
114
- } ) ,
115
- ) ;
110
+ } ,
111
+ ] ;
112
+ }
113
+
114
+ return acc ;
115
+ } , [ ] ) ;
116
116
117
- export const getServerSideProps = async ( ) : Promise <
118
- GetStaticPropsResult < BookmarksProps >
119
- > => {
117
+ export const getServerSideProps = async ( {
118
+ res ,
119
+ } : GetServerSidePropsContext ) => {
120
120
const bookmarks = await getBookmarks ( ) ;
121
+
122
+ res . setHeader (
123
+ 'Cache-Control' ,
124
+ 'public, s-maxage=3600, stale-while-revalidate=60' ,
125
+ ) ;
126
+
121
127
return {
122
128
props : {
123
129
bookmarks : formatBookmarks ( bookmarks ) ,
0 commit comments