Skip to content

Commit

Permalink
Merge pull request #34 from p12-sandbox/refactor/ESlint-error
Browse files Browse the repository at this point in the history
Refactor/e slint error
  • Loading branch information
nacal authored May 28, 2022
2 parents 682f258 + 3050e4e commit cea345d
Show file tree
Hide file tree
Showing 27 changed files with 1,329 additions and 1,767 deletions.
3 changes: 3 additions & 0 deletions .eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
module.exports = {
"extends": ["next", "next/core-web-vitals"]
}
5 changes: 5 additions & 0 deletions .prettierrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
module.exports = {
printWidth: 120,
singleQuote: true,
semi: false,
}
9 changes: 9 additions & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
{
"editor.formatOnSave": true,
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
}
1 change: 0 additions & 1 deletion next-env.d.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
/// <reference types="next" />
/// <reference types="next/types/global" />
/// <reference types="next/image-types/global" />

// NOTE: This file should not be edited
Expand Down
14 changes: 10 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,21 +7,27 @@
"build": "run-s build:posts build:next",
"build:posts": "ts-node --project tsconfig.builder.json ./src/builder/posts.ts",
"build:next": "next build",
"start": "next start"
"start": "next start",
"lint": "next lint",
"fix": "yarn format && yarn lint:fix",
"format": "prettier --write ./src/**/**/*.{js,jsx,ts,tsx}"
},
"dependencies": {
"dayjs": "^1.9.3",
"next": "11.1.2",
"next": "^12.1.5",
"next-themes": "^0.0.15",
"react": "17.0.2",
"react-dom": "17.0.2"
"react": "^18.1.0",
"react-dom": "^18.1.0"
},
"devDependencies": {
"@types/fs-extra": "^9.0.2",
"@types/node": "^16.11.1",
"@types/react-dom": "^17.0.9",
"@typescript-eslint/eslint-plugin": "^5.0.0",
"@typescript-eslint/parser": "^5.0.0",
"eslint": "^8.14.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-config-next": "12.1.5",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-react": "^7.21.4",
Expand Down
Empty file added src/.prettierrc
Empty file.
79 changes: 39 additions & 40 deletions src/builder/posts.ts
Original file line number Diff line number Diff line change
@@ -1,82 +1,81 @@
import fs from "fs-extra";
import Parser from "rss-parser";
import { members } from "../../members";
import { PostItem, Member } from "../types";
export default {};
import fs from 'fs-extra'
import Parser from 'rss-parser'
import { members } from '../../members'
import { PostItem, Member } from '../types'

type FeedItem = {
title: string;
link: string;
contentSnippet?: string;
isoDate?: string;
dateMiliSeconds: number;
};
title: string
link: string
contentSnippet?: string
isoDate?: string
dateMiliSeconds: number
}

const parser = new Parser();
let allPostItems: PostItem[] = [];
const parser = new Parser()
let allPostItems: PostItem[] = []

async function fetchFeedItems(url: string) {
const feed = await parser.parseURL(url);
if (!feed?.items?.length) return [];
const feed = await parser.parseURL(url)
if (!feed?.items?.length) return []

// return item which has title and link
return feed.items
.map(({ title, contentSnippet, link, isoDate }) => {
return {
title,
contentSnippet: contentSnippet?.replace(/\n/g, ""),
contentSnippet: contentSnippet?.replace(/\n/g, ''),
link,
isoDate,
dateMiliSeconds: isoDate ? new Date(isoDate).getTime() : 0,
};
}
})
.filter(({ title, link }) => title && link) as FeedItem[];
.filter(({ title, link }) => title && link) as FeedItem[]
}

async function getFeedItemsFromSources(sources: undefined | string[]) {
if (!sources?.length) return [];
let feedItems: FeedItem[] = [];
if (!sources?.length) return []
let feedItems: FeedItem[] = []
for (const url of sources) {
const items = await fetchFeedItems(url);
if (items) feedItems = [...feedItems, ...items];
const items = await fetchFeedItems(url)
if (items) feedItems = [...feedItems, ...items]
}
return feedItems;
return feedItems
}

async function getMemberFeedItems(member: Member): Promise<PostItem[]> {
const { id, sources, name, includeUrlRegex, excludeUrlRegex } = member;
const feedItems = await getFeedItemsFromSources(sources);
if (!feedItems) return [];
const { id, sources, name, includeUrlRegex, excludeUrlRegex } = member
const feedItems = await getFeedItemsFromSources(sources)
if (!feedItems) return []

let postItems = feedItems.map((item) => {
return {
...item,
authorName: name,
authorId: id,
};
});
}
})
// remove items which not matches includeUrlRegex
if (includeUrlRegex) {
postItems = postItems.filter((item) => {
return item.link.match(new RegExp(includeUrlRegex));
});
return item.link.match(new RegExp(includeUrlRegex))
})
}
// remove items which matches excludeUrlRegex
if (excludeUrlRegex) {
postItems = postItems.filter((item) => {
return !item.link.match(new RegExp(excludeUrlRegex));
});
return !item.link.match(new RegExp(excludeUrlRegex))
})
}

return postItems;
return postItems
}

(async function () {
;(async function () {
for (const member of members) {
const items = await getMemberFeedItems(member);
if (items) allPostItems = [...allPostItems, ...items];
const items = await getMemberFeedItems(member)
if (items) allPostItems = [...allPostItems, ...items]
}
allPostItems.sort((a, b) => b.dateMiliSeconds - a.dateMiliSeconds);
fs.ensureDirSync(".contents");
fs.writeJsonSync(".contents/posts.json", allPostItems);
})();
allPostItems.sort((a, b) => b.dateMiliSeconds - a.dateMiliSeconds)
fs.ensureDirSync('.contents')
fs.writeJsonSync('.contents/posts.json', allPostItems)
})()
14 changes: 6 additions & 8 deletions src/components/ContentWrapper.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,9 @@
export const ContentWrapper: React.FC<{ children: React.ReactNode }> = (
props
) => {
return <div className="content-wrapper">{props.children}</div>;
};
export const ContentWrapper: React.FC<{ children: React.ReactNode }> = (props) => {
return <div className="content-wrapper">{props.children}</div>
}

export const UndoWrapForScroll: React.FC<{
children: React.ReactNode;
children: React.ReactNode
}> = (props) => {
return <div className="undo-wrap-for-scroll">{props.children}</div>;
};
return <div className="undo-wrap-for-scroll">{props.children}</div>
}
4 changes: 2 additions & 2 deletions src/components/LinkBackHome.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import Link from "next/link";
import Link from 'next/link'

export const LinkBackHome: React.FC = () => (
<Link href="/" passHref>
<a className="link-back-home">Back Home</a>
</Link>
);
)
45 changes: 15 additions & 30 deletions src/components/PageSEO.tsx
Original file line number Diff line number Diff line change
@@ -1,43 +1,28 @@
import Head from "next/head";

import { config } from "@site.config";
import Head from 'next/head'
import { config } from '@site.config'

// types
type Props = {
title: string;
path?: string;
description?: string;
ogImageUrl?: string;
noindex?: boolean;
removeSiteNameFromTitle?: boolean;
};
title: string
path?: string
description?: string
ogImageUrl?: string
noindex?: boolean
removeSiteNameFromTitle?: boolean
}

export const PageSEO: React.FC<Props> = (props) => {
const {
path,
title,
description,
ogImageUrl,
noindex,
removeSiteNameFromTitle,
} = props;
const { path, title, description, ogImageUrl, noindex, removeSiteNameFromTitle } = props

const pageUrl = `${config.siteRoot}${path || ""}`;
const pageUrl = `${config.siteRoot}${path || ''}`
return (
<Head>
<title>
{removeSiteNameFromTitle
? title
: `${title} | ${config.siteMeta.title}`}
</title>
<title>{removeSiteNameFromTitle ? title : `${title} | ${config.siteMeta.title}`}</title>
<meta property="og:title" content={title} />
<meta property="og:url" content={pageUrl} />
<meta name="twitter:card" content="summary_large_image" />
<meta property="og:site" content={config.siteMeta.title} />
<meta
property="og:image"
content={ogImageUrl || `${config.siteRoot}/og.png`}
/>
<meta property="og:image" content={ogImageUrl || `${config.siteRoot}/og.png`} />
{!!description && (
<>
<meta name="description" content={description} />
Expand All @@ -47,5 +32,5 @@ export const PageSEO: React.FC<Props> = (props) => {
{path && <link rel="canonical" href={pageUrl} />}
{noindex && <meta name="robots" content="noindex" />}
</Head>
);
};
)
}
64 changes: 23 additions & 41 deletions src/components/PostList.tsx
Original file line number Diff line number Diff line change
@@ -1,36 +1,31 @@
import { useState } from "react";
import Link from "next/link";
import dayjs from "dayjs";
import relativeTime from "dayjs/plugin/relativeTime";

import { PostItem } from "@src/types";
import { useState } from 'react'
import Link from 'next/link'
import Image from 'next/image'
import dayjs from 'dayjs'
import relativeTime from 'dayjs/plugin/relativeTime'
import { PostItem } from '@src/types'
import {
getMemberByName,
getHostFromURL,
getFaviconSrcFromHostname,
getMemberPath,
getMemberById,
} from "@src/utils/helper";
} from '@src/utils/helper'

dayjs.extend(relativeTime);
dayjs.extend(relativeTime)

const PostLink: React.FC<{ item: PostItem }> = (props) => {
const { authorId, title, isoDate, link, dateMiliSeconds } = props.item;
const member = getMemberById(authorId);
if (!member) return null;
const { authorId, title, isoDate, link, dateMiliSeconds } = props.item
const member = getMemberById(authorId)
if (!member) return null

const hostname = getHostFromURL(link);
const hostname = getHostFromURL(link)

return (
<article className="post-link">
<Link href={getMemberPath(member.id)} passHref>
<a className="post-link__author">
<img
src={member.avatarSrc}
className="post-link__author-img"
width={35}
height={35}
/>
<Image src={member.avatarSrc} alt={member.name} className="post-link__author-img" width={35} height={35} />
<div className="post-link__author-name">
<div className="post-link__author-name">{member.name}</div>
<time dateTime={isoDate} className="post-link__date">
Expand All @@ -41,32 +36,22 @@ const PostLink: React.FC<{ item: PostItem }> = (props) => {
</Link>
<a href={link} className="post-link__main-link">
<h2 className="post-link__title">{title}</h2>
{hostname && (
<div className="post-link__site">
<img
src={getFaviconSrcFromHostname(hostname)}
width={14}
height={14}
className="post-link__site-favicon"
/>
{hostname}
</div>
)}
{hostname && <div className="post-link__site">{hostname}</div>}
</a>
{dateMiliSeconds && dateMiliSeconds > Date.now() - 86400000 * 3 && (
<div className="post-link__new-label">NEW</div>
)}
</article>
);
};
)
}

export const PostList: React.FC<{ items: PostItem[] }> = (props) => {
const [displayItemsCount, setDisplayItemsCount] = useState<number>(32);
const totalItemsCount = props.items?.length || 0;
const canLoadMore = totalItemsCount - displayItemsCount > 0;
const [displayItemsCount, setDisplayItemsCount] = useState<number>(32)
const totalItemsCount = props.items?.length || 0
const canLoadMore = totalItemsCount - displayItemsCount > 0

if (!totalItemsCount) {
return <div className="post-list-empty">No posts yet</div>;
return <div className="post-list-empty">No posts yet</div>
}

return (
Expand All @@ -78,14 +63,11 @@ export const PostList: React.FC<{ items: PostItem[] }> = (props) => {
</div>
{canLoadMore && (
<div className="post-list-load">
<button
onClick={() => setDisplayItemsCount(displayItemsCount + 32)}
className="post-list-load__button"
>
<button onClick={() => setDisplayItemsCount(displayItemsCount + 32)} className="post-list-load__button">
LOAD MORE
</button>
</div>
)}
</>
);
};
)
}
Loading

0 comments on commit cea345d

Please sign in to comment.