oxen-io
/
oxen-website
mirror of https://github.com/oxen-io/oxen-website.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #52 from yougotwill/dev 

Dev updates
This commit is contained in:
William Grant 2022-03-04 12:02:10 +11:00 committed by GitHub
parent d6d87a31ce 259e60eaef
commit 6778b4e1d1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 52 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.env.example
View File

@ -1,4 +1,5 @@
CONTENTFUL_SPACE_ID=
CONTENTFUL_ENVIRONMENT_ID=
CONTENTFUL_ACCESS_TOKEN=
CONTENTFUL_PREVIEW_TOKEN=
CAMPAIGN_MONITOR_CLIENT_ID=

4
components/RichPage.tsx
View File

@ -21,7 +21,7 @@ export default function RichPage(props: Props) {
useEffect(() => {
dispatch(setPageType(PageType.NORMAL));
}, []);
}, [dispatch]);
return (
<>
@ -42,7 +42,7 @@ export default function RichPage(props: Props) {
<div
className={classNames(
'relative w-full',
loaded ? 'block' : 'hidden',
loaded ? 'opacity-100' : 'opacity-0',
)}
style={{ height: '33vh' }}
>

6
components/TagBlock.tsx
View File

@ -1,5 +1,5 @@
import classNames from 'classnames';
import React from 'react';
import classNames from 'classnames';
interface Props {
tag: string;
@ -9,7 +9,7 @@ interface Props {
export function TagBlock(props: Props) {
const { tag, size = 'small', classes } = props;
const href = `/tag/${tag.toLowerCase()}`;
const href = `/tag/${tag}`;
return (
<a
@ -23,7 +23,7 @@ export function TagBlock(props: Props) {
classes,
)}
>
<span className="px-2">{tag.toLowerCase()}</span>
<span className="px-2">{tag}</span>
</a>
);
}

1
next.config.js
View File

@ -57,6 +57,7 @@ const securityHeaders = () => {
const nextConfig = {
env: {
CONTENTFUL_SPACE_ID: process.env.CONTENTFUL_SPACE_ID,
CONTENTFUL_ENVIRONMENT_ID: process.env.CONTENTFUL_ENVIRONMENT_ID,
CONTENTFUL_ACCESS_TOKEN: process.env.CONTENTFUL_ACCESS_TOKEN,
CONTENTFUL_PREVIEW_TOKEN: process.env.CONTENTFUL_PREVIEW_TOKEN,
CAMPAIGN_MONITOR_CLIENT_ID: process.env.CAMPAIGN_MONITOR_CLIENT_ID,

12
pages/tag/[...slug].tsx
View File

@ -1,5 +1,6 @@
import { CMS, METADATA } from '@/constants';
import { GetStaticPaths, GetStaticProps, GetStaticPropsContext } from 'next';
import { IPost, ITagList } from '@/types/cms';
import { PageType, setPageType } from '@/state/navigation';
import { ReactElement, useEffect } from 'react';
@ -9,7 +10,6 @@ import { CmsApi } from '@/services/cms';
import { Contained } from '@/components/Contained';
import CustomHead from '@/components/CustomHead';
import { IPath } from '@/types';
import { IPost } from '@/types/cms';
import Pagination from '@/components/Pagination';
import { TagBlock } from '@/components/TagBlock';
import classNames from 'classnames';
@ -38,7 +38,7 @@ export default function Tag(props: Props): ReactElement {
useEffect(() => {
dispatch(setPageType(PageType.BLOG));
}, []);
}, [dispatch]);
return (
<>
@ -177,16 +177,16 @@ export const getStaticProps: GetStaticProps = async (
export const getStaticPaths: GetStaticPaths = async () => {
const cms = new CmsApi();
const tags = Object.values(await cms.fetchTagList());
const tags: ITagList = await cms.fetchTagList();
const paths: IPath[] = [];
for (let i = 0; i < tags.length; i++) {
const { entries, total } = await cms.fetchBlogEntriesByTag(tags[i]);
for (let tag of Object.values(tags)) {
const { entries, total } = await cms.fetchBlogEntriesByTag(tag);
const pageCount = Math.ceil(total / CMS.BLOG_RESULTS_PER_PAGE);
const _paths = [];
for (let j = 1; j <= pageCount; j++) {
_paths.push({ params: { slug: [tags[i], String(j)] } });
_paths.push({ params: { slug: [tag, String(j)] } });
}
paths.push(..._paths);

59
services/cms.tsx
View File

@ -1,5 +1,10 @@
import { Block, Document, Inline } from '@contentful/rich-text-types';
import { ContentfulClientApi, EntryCollection, createClient } from 'contentful';
import {
ContentfulClientApi,
EntryCollection,
createClient,
Tag,
} from 'contentful';
import {
IAuthor,
IFAQItem,
@ -37,21 +42,17 @@ export class CmsApi {
constructor() {
this.client = createClient({
space: process.env.CONTENTFUL_SPACE_ID,
environment: process.env.CONTENTFUL_ENVIRONMENT_ID,
accessToken: process.env.CONTENTFUL_ACCESS_TOKEN,
host: 'cdn.contentful.com',
});
}
public async fetchTagList(): Promise<ITagList> {
// TODO Migrate to Contentful Tag System
const { entries, total } = await this.fetchBlogEntries();
const _tags = await this.client.getTags();
const tags: ITagList = {};
entries.forEach(entry => {
entry.tags.forEach(tag => {
if (!tags[tag]) {
tags[tag] = tag;
}
});
_tags.items.forEach(tag => {
tags[tag.sys.id] = tag.name;
});
return tags;
}
@ -79,10 +80,15 @@ export class CmsApi {
quantity = CMS.BLOG_RESULTS_PER_PAGE_TAGGED,
page = 1,
): Promise<IFetchBlogEntriesReturn> {
const taglist = await this.fetchTagList();
const id = Object.entries(taglist).filter(([_, value]) => {
return tag === value;
})[0][0];
const _entries = await this.client.getEntries({
content_type: 'post',
order: '-fields.date',
'fields.tags[in]': tag,
'metadata.tags.sys.id[in]': id,
limit: quantity,
skip: (page - 1) * quantity,
});
@ -102,11 +108,11 @@ export class CmsApi {
quantity = CMS.BLOG_RESULTS_PER_PAGE,
page = 1,
): Promise<IFetchBlogEntriesReturn> {
const DEV_UPDATE_TAG = 'dev-update';
const DEV_UPDATE_TAG = 'devUpdate';
const _entries = await this.client.getEntries({
content_type: 'post', // only fetch blog post entry
order: '-fields.date',
'fields.tags[ne]': DEV_UPDATE_TAG, // Exclude blog posts with the "dev-update" tag
'metadata.tags.sys.id[nin]': DEV_UPDATE_TAG, // Exclude blog posts with the "dev-update" tag
limit: quantity,
skip: (page - 1) * quantity,
});
@ -155,10 +161,11 @@ export class CmsApi {
};
}
public async fetchEntryById(id): Promise<IPost> {
return this.client.getEntry(id).then(entry => {
public async fetchEntryById(id: any): Promise<IPost> {
return this.client.getEntry(id).then(async entry => {
if (entry) {
return this.convertPost(entry);
const taglist = await this.fetchTagList();
return this.convertPost(entry, taglist);
}
return null;
});
@ -186,7 +193,8 @@ export class CmsApi {
let entry;
switch (entryType) {
case 'post':
entry = this.convertPost(_entries.items[0]);
const taglist = await this.fetchTagList();
entry = this.convertPost(_entries.items[0], taglist);
break;
case 'splitPage':
entry = this.convertPage(_entries.items[0]);
@ -215,7 +223,8 @@ export class CmsApi {
let entry;
switch (entryType) {
case 'post':
entry = this.convertPost(_entries.items[0]);
const taglist = await this.fetchTagList();
entry = this.convertPost(_entries.items[0], taglist);
break;
case 'splitPage':
entry = this.convertPage(_entries.items[0]);
@ -253,7 +262,10 @@ export class CmsApi {
if (entries && entries.items && entries.items.length > 0) {
switch (entryType) {
case 'post':
_entries = entries.items.map(entry => this.convertPost(entry));
const taglist = await this.fetchTagList();
_entries = entries.items.map(entry =>
this.convertPost(entry, taglist),
);
break;
case 'faq':
_entries = entries.items.map(entry => this.convertFAQ(entry));
@ -295,7 +307,14 @@ export class CmsApi {
}
: null;
public convertPost = (rawData): IPost => {
public convertTags = (rawTags: any, taglist: ITagList): string[] => {
const tags = rawTags.map((tag: Tag) => {
return taglist[tag.sys.id];
});
return tags;
};
public convertPost = (rawData: any, taglist: ITagList): IPost => {
const rawPost = rawData.fields;
const rawFeatureImage = rawPost?.featureImage
? rawPost?.featureImage.fields
@ -310,7 +329,7 @@ export class CmsApi {
publishedDateISO: rawPost.date,
publishedDate: format(parseISO(rawPost.date), 'dd MMMM yyyy'),
slug: rawPost.slug,
tags: rawPost?.tags, //?.map(t => t?.fields?.label) ?? [],
tags: this.convertTags(rawData.metadata.tags, taglist),
title: rawPost.title,
featureImage: this.convertImage(rawFeatureImage),
author: this.convertAuthor(rawAuthor),