Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Implement TrustPositif Checking & Refactor Index #29

Merged
merged 8 commits into from Aug 1, 2022
Merged

Implement TrustPositif Checking & Refactor Index #29

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
02a53fc
Implement TrustPositif checking
Meta502 Jul 30, 2022
fa56b84
Moved websiteSections to own file in _data, move TrustPositif fetchin…
Meta502 Jul 30, 2022
5eb0673
Split TP check request to chunks of 100 websites at a time
Meta502 Jul 30, 2022
d30d0db
Add TP indicator to registered but inaccessible websites
Meta502 Jul 30, 2022
847e26f
Added extra explanation for TrustPositive status
Meta502 Jul 30, 2022
1090ab1
fix: await promise
angeloanan Aug 1, 2022
8182e96
fix: grammar error
angeloanan Aug 1, 2022
8dd888d
feat: implement basic trycatching
angeloanan Aug 1, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Expand Up @@ -22,6 +22,7 @@
"@next/bundle-analyzer": "^12.1.0",
"autoprefixer": "^10.4.0",
"fuse.js": "^6.6.2",
"https": "^1.0.0",
angeloanan marked this conversation as resolved.
Show resolved Hide resolved
"next": "^12.1.0",
"next-compose-plugins": "^2.2.1",
"next-seo": "^5.1.0",
Expand Down
20 changes: 17 additions & 3 deletions src/components/WebsiteEntry.tsx
View file
Open in desktop
@@ -1,3 +1,4 @@
/* eslint-disable @next/next/no-img-element */
import { AlertCircle, Check, HelpCircle, X } from 'react-feather'
import { SimpleIcon } from 'simple-icons'

Expand All @@ -12,10 +13,15 @@ interface WebsiteEntryProps {
*/
registered?: boolean

/**
* Blocked in Trust Positif's Network - Checked via https://trustpositif.kominfo.go.id
*/
trustPositif?: boolean

/**
* Blocked in Indihome's Network - Checked via https://indi.wtf
*/
blocked?: boolean
indiWtf?: boolean
}

const LoadingSpinnerIcon = () => (
Expand Down Expand Up @@ -45,10 +51,13 @@ const LoadingSpinnerIcon = () => (
export const WebsiteEntry = ({
website,
registered = false,
blocked = false
indiWtf = false,
trustPositif = false
}: WebsiteEntryProps) => {
const size = 32

const blocked = indiWtf || trustPositif

return (
<li
className={`flex items-center gap-2 rounded p-4 outline outline-2 ${
Expand Down Expand Up @@ -96,7 +105,12 @@ export const WebsiteEntry = ({
</>
) : (
<>
<X aria-hidden /> Blocked
<X aria-hidden /> Blocked{' '}
{trustPositif && (
<small data-tip data-for='blocked'>
TP
</small>
)}
</>
)}
</p>
Expand Down
23 changes: 23 additions & 0 deletions src/pages/api/trustPositif.ts
View file
Open in desktop
@@ -0,0 +1,23 @@
import https from 'https'
import { NextApiHandler } from 'next'

const httpsAgent = new https.Agent({
rejectUnauthorized: false
})

const handler: NextApiHandler = async (req, res) => {
const trustPositifData = await fetch(
'https://trustpositif.kominfo.go.id/Rest_server/getrecordsname_home',
{
method: 'POST',
body: new URLSearchParams(req.body),
agent: httpsAgent
} as any
).then((res) => res.json())

return res
.setHeader('Cache-Control', 'public, s-maxage=60, stale-while-revalidate=3600')
.json(trustPositifData)
}

export default handler
153 changes: 78 additions & 75 deletions src/pages/index.tsx
View file
Open in desktop
Expand Up @@ -53,11 +53,67 @@ export async function getStaticProps(
}
}

const sections = [
{
title: 'Indonesia Starterpack',
description: <p>Situs atau service ini terpopuler dengan orang Indonesia</p>,
sites: idnStarterPack
},
{
title: 'Essential Developer Toolkit',
description: <p>Service yang ✨ anak bangsa ✨ mungkin akan pakai saat membuat app</p>,
sites: devStarterPack
},
{
title: 'Top websites USA',
description: (
<>
<p>
2022 Top websites in the USA. Sumber data website diambil dari{' '}
<a
href='https://www.semrush.com/blog/most-visited-websites/'
className='text-blue-700 underline'
target='_blank'
rel='noreferrer'
>
semrush.com
</a>
</p>
<p>
<em>Catatan: Ada beberapa website ditiadakan karena tidak berhubungan</em>
</p>
</>
),
sites: websiteListUSA
},
{
title: 'Linux Starterpack',
description: <p>Service yang sering dipakai Linux user 🐧</p>,
sites: linuxStarterPack
}
]

angeloanan marked this conversation as resolved.
Show resolved Hide resolved
const IndexPage = ({ PSEData: data, blockData }: IndexPageProps) => {
const [trustPositifMap, setTrustPositifMap] = React.useState<Map<String, String>>(new Map())

React.useEffect(() => {
fetch('/api/trustPositif', {
method: 'POST',
body: new URLSearchParams({
name: allWebsitesCombined
.map((item) => item.website.replace(/(https?:\/\/)/, '').replace(/www\./, ''))
.join('\n')
})
})
.then((res) => res.json())
.then((res) =>
setTrustPositifMap(new Map(res.values.map((item: any) => [item.Domain, item.Status])))
)
}, [])

angeloanan marked this conversation as resolved.
Show resolved Hide resolved
return (
<>
<NextSeo />

<div className='flex w-full justify-center'>
<div className='w-full max-w-screen-xl p-8'>
<header className='flex w-full flex-col items-center'>
Expand All @@ -69,80 +125,27 @@ const IndexPage = ({ PSEData: data, blockData }: IndexPageProps) => {

<ExplanationSection />

<section className='mt-8'>
<h2 className='text-2xl font-semibold'>Indonesia Starterpack</h2>
<p>Situs atau service ini terpopuler dengan orang Indonesia</p>
<ul className='mt-4 grid grid-flow-row grid-cols-1 gap-8 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4'>
{idnStarterPack.map((website) => (
<WebsiteEntry
website={website.icon}
key={website.icon.title}
blocked={blockData?.[website.website] ?? false}
registered={data[website.website]}
/>
))}
</ul>
</section>

<section className='mt-8'>
<h2 className='text-2xl font-semibold'>Essential developer toolkit</h2>
<p>Service yang ✨ anak bangsa ✨ mungkin akan pakai saat membuat app</p>

<ul className='mt-4 grid grid-flow-row grid-cols-1 gap-8 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4'>
{devStarterPack.map((website) => (
<WebsiteEntry
website={website.icon}
key={website.icon.title}
blocked={blockData?.[website.website] ?? false}
registered={data[website.website]}
/>
))}
</ul>
</section>

<section className='mt-8'>
<h2 className='text-2xl font-semibold'>Top websites USA</h2>
<p>
2022 Top websites in the USA. Sumber data website diambil dari{' '}
<a
href='https://www.semrush.com/blog/most-visited-websites/'
className='text-blue-700 underline'
target='_blank'
rel='noreferrer'
>
semrush.com
</a>
</p>
<p>
<em>Catatan: Ada beberapa website ditiadakan karena tidak berhubungan</em>
</p>
<ul className='mt-4 grid grid-flow-row grid-cols-1 gap-8 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4'>
{websiteListUSA.map((website) => (
<WebsiteEntry
website={website.icon}
key={website.icon.title}
blocked={blockData?.[website.website] ?? false}
registered={data[website.website]}
/>
))}
</ul>
</section>

<section className='mt-8'>
<h2 className='text-2xl font-semibold'>Linux Starterpack</h2>
<p>Service yang sering dipakai Linux user 🐧</p>

<div className='mt-4 grid grid-flow-row grid-cols-1 gap-8 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4'>
{linuxStarterPack.map((website) => (
<WebsiteEntry
website={website.icon}
key={website.icon.title}
blocked={blockData?.[website.website] ?? false}
registered={data[website.website]}
/>
))}
</div>
</section>
{sections.map((item) => (
<section className='mt-8' key={item.title}>
<h2 className='text-2xl font-semibold'>{item.title}</h2>
<div>{item.description}</div>
<ul className='mt-4 grid grid-flow-row grid-cols-1 gap-8 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4'>
{item.sites.map((website) => (
<WebsiteEntry
website={website.icon}
key={website.icon.title}
trustPositif={
trustPositifMap.get(
website.website.replace(/(https?:\/\/)/, '').replace(/www\./, '')
) === 'Ada'
}
indiWtf={blockData?.[website.website] ?? false}
registered={data[website.website]}
/>
))}
</ul>
</section>
))}

<ManualSearchSection />

Expand Down
5 changes: 5 additions & 0 deletions yarn.lock
View file
Open in desktop
Expand Up @@ -1389,6 +1389,11 @@ has@^1.0.3:
dependencies:
function-bind "^1.1.1"

https@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/https/-/https-1.0.0.tgz#3c37c7ae1a8eeb966904a2ad1e975a194b7ed3a4"
integrity sha512-4EC57ddXrkaF0x83Oj8sM6SLQHAWXw90Skqu2M4AEWENZ3F02dFJE/GARA8igO79tcgYqGrD7ae4f5L3um2lgg==

husky@^8.0.1:
version "8.0.1"
resolved "https://registry.yarnpkg.com/husky/-/husky-8.0.1.tgz#511cb3e57de3e3190514ae49ed50f6bc3f50b3e9"
Expand Down