7 |
26 |
8 |
25 | 404 Error
9 |Page not found
10 |Sorry, the page you are looking for could not be found or has been removed.
11 | 15 | Go back 16 | 23 | 24 |{children}
6 | ); 7 | -------------------------------------------------------------------------------- /components/ui/Comment/Comment.Date.tsx: -------------------------------------------------------------------------------- 1 | import mergeTW from '@/utils/mergeTW' 2 | import { ReactNode } from 'react' 3 | 4 | export const CommentDate = ({ className, children }: { className?: string; children?: ReactNode }) => ( 5 | {children} 6 | ) 7 | -------------------------------------------------------------------------------- /components/ui/LabelError/LabelError.tsx: -------------------------------------------------------------------------------- 1 | import mergeTW from '@/utils/mergeTW' 2 | import { ReactNode } from 'react' 3 | 4 | export default ({ className, children }: { className?: string; children?: ReactNode }) => ( 5 | {children} 6 | ) 7 | -------------------------------------------------------------------------------- /components/ui/Stats/Stat.tsx: -------------------------------------------------------------------------------- 1 | import mergeTW from '@/utils/mergeTW' 2 | import { type ReactNode } from 'react' 3 | 4 | export const Stat = ({ children, className }: { children: ReactNode; className?: string }) => ( 5 |{children}
6 | );
7 |
--------------------------------------------------------------------------------
/components/ui/TagsGroup/TagsGroup.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 | import { ReactNode } from 'react'
3 |
4 | export const TagsGroup = ({ children, className = '' }: { children: ReactNode; className?: string }) => (
5 | - {children}
{children}
6 | )
7 |
--------------------------------------------------------------------------------
/components/ui/HighlightCode/index.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { useEffect } from 'react';
4 | import hljs from 'highlight.js';
5 | import 'highlight.js/styles/vs2015.min.css';
6 |
7 | export default function HighlightCode() {
8 | useEffect(() => {
9 | hljs.highlightAll();
10 | }, []);
11 | return null;
12 | }
13 |
--------------------------------------------------------------------------------
/components/ui/Stats/Stats.Wrapper.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 | import { type ReactNode } from 'react'
3 |
4 | export const StatsWrapper = ({ children, className }: { children: ReactNode; className?: string }) => (
5 | - {children}
{children}
6 | ) 7 | -------------------------------------------------------------------------------- /components/ui/Stats/Stat.CountItem.tsx: -------------------------------------------------------------------------------- 1 | import mergeTW from '@/utils/mergeTW' 2 | import { type ReactNode } from 'react' 3 | 4 | export const StatCountItem = ({ children, className }: { children: ReactNode; className?: string }) => ( 5 | {children} 6 | ) 7 | -------------------------------------------------------------------------------- /components/ui/Stats/Stat.Item.tsx: -------------------------------------------------------------------------------- 1 | import mergeTW from '@/utils/mergeTW' 2 | import { type ReactNode } from 'react' 3 | 4 | export const StatItem = ({ children, className }: { children: ReactNode; className?: string }) => ( 5 |{children}
6 | )
7 |
--------------------------------------------------------------------------------
/components/ui/Comment/Comment.UserName.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 | import { ReactNode } from 'react'
3 |
4 | export const CommentUserName = ({ className, children }: { className?: string; children?: ReactNode }) => (
5 | {children}
6 | )
7 |
--------------------------------------------------------------------------------
/components/ui/Comment/Comments.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { HTMLAttributes, ReactNode, useEffect } from 'react'
4 |
5 | interface Props extends HTMLAttributes- {children}
5 |
10 | );
11 |
--------------------------------------------------------------------------------
/components/Icons/IconPlay.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 |
3 | export const IconPlay = ({ className = '' }: { className?: string }) => (
4 |
7 | );
8 |
--------------------------------------------------------------------------------
/components/ui/ToolCard/Tool.Tags.tsx:
--------------------------------------------------------------------------------
1 | export default ({ items }: { items: any[] }) => (
2 |
6 | {count}
7 | Impressions
8 |
9 |
3 | {items.slice(0, 3).map((item, idx) => (
4 | <>
5 | {item}
6 |
7 |
8 | ))}
9 |
10 | );
11 |
--------------------------------------------------------------------------------
/components/ui/ProfileFormModal/index.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import Modal from '@/components/ui/Modal';
4 | import ProfileFormModal from './ProfileFormModal';
5 |
6 | export default ({ isModalOpen }: { isModalOpen: boolean }) => {
7 | return (
8 | {children}
:
5 | 
6 |
10 | );
11 |
--------------------------------------------------------------------------------
/utils/supabase/browser.ts:
--------------------------------------------------------------------------------
1 | import { type SupabaseClient, createClientComponentClient } from '@supabase/auth-helpers-nextjs';
2 | import { type Database } from '@/utils/supabase/types';
3 |
4 | export const createBrowserClient = (): SupabaseClient
7 |
9 |
8 | 
14 |
15 | );
16 |
--------------------------------------------------------------------------------
/components/Icons/IconArrowLongLeft.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 |
3 | export const IconArrowLongLeft = ({ className = '' }: { className?: string }) => (
4 |
16 | )
17 |
--------------------------------------------------------------------------------
/components/Icons/IconClipboard.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 |
3 | export const IconClipboard = ({ className = '' }: { className?: string }) => (
4 |
18 | );
19 |
--------------------------------------------------------------------------------
/public/vercel.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/components/ui/Gallery/GalleryImage.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 |
3 | export const GalleryImage = ({
4 | src = '',
5 | alt = '',
6 | className = '',
7 | imgClassName = '',
8 | ...props
9 | }: {
10 | src: string;
11 | alt?: string;
12 | className?: string;
13 | imgClassName?: string;
14 | }) => {
15 | src += '&w=750';
16 |
17 | return (
18 |
17 |
19 | );
20 | };
21 |
--------------------------------------------------------------------------------
/app/api/login/route.ts:
--------------------------------------------------------------------------------
1 | import axios from 'axios';
2 | import { NextResponse } from 'next/server';
3 |
4 | export async function POST(req: Request) {
5 | const { firstName, personalEMail } = await req.json();
6 |
7 | const WELCOME_EMAIL_API_KEY = process.env.WELCOME_EMAIL_API_KEY as string;
8 | const SIGNUP_FORM_ID = process.env.SIGNUP_FORM_ID as string;
9 |
10 | const apiURL = `https://cron.ventryweather.com/webhook-devhunt.php?apikey=${WELCOME_EMAIL_API_KEY}&name=${firstName}&tag=api&email=${personalEMail}&formid=${SIGNUP_FORM_ID}`;
11 | const res = await axios.get(apiURL);
12 | return NextResponse.json({ data: res.data });
13 | }
14 |
--------------------------------------------------------------------------------
/components/ui/BlurBackground/BlurBackground.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 |
3 | export default ({
4 | className = '',
5 | isActive,
6 | setActive = () => null,
7 | ...props
8 | }: {
9 | isActive: boolean;
10 | setActive?: (bool: boolean) => void;
11 | className?: string;
12 | }) => (
13 | - {children}
setActive(false)}
21 | >
22 | );
23 |
--------------------------------------------------------------------------------
/components/ui/Checkbox/Checkbox.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 | import { HTMLAttributes } from 'react'
3 |
4 | interface Props extends HTMLAttributes
14 | {src ? (
15 |
24 | )
25 |
--------------------------------------------------------------------------------
/utils/supabase/services/CacheService.ts:
--------------------------------------------------------------------------------
1 | import NodeCache from 'node-cache';
2 |
3 | const stdTTL = 30;
4 | class CacheService {
5 | private _cache = new NodeCache({ stdTTL });
6 |
7 | async get(key: string, asyncFetcher: () => Promise
15 | {children}
16 |
17 |
18 | );
19 | };
20 |
--------------------------------------------------------------------------------
/components/Icons/IconPhoto.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 |
3 | export const IconPhoto = ({ className = '' }: { className?: string }) => (
4 |
18 | )
19 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es5",
4 | "lib": ["dom", "dom.iterable", "esnext"],
5 | "allowJs": true,
6 | "skipLibCheck": true,
7 | "strict": true,
8 | "forceConsistentCasingInFileNames": true,
9 | "noEmit": true,
10 | "esModuleInterop": true,
11 | "module": "esnext",
12 | "moduleResolution": "node",
13 | "resolveJsonModule": true,
14 | "isolatedModules": true,
15 | "jsx": "preserve",
16 | "incremental": true,
17 | "baseUrl": "./",
18 | "plugins": [
19 | {
20 | "name": "next"
21 | }
22 | ],
23 | "paths": {
24 | "@/*": ["./*"]
25 | }
26 | },
27 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
28 | "exclude": ["node_modules"]
29 | }
30 |
--------------------------------------------------------------------------------
/components/Icons/IconChartBar.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 |
3 | export const IconChartBar = ({ className = '' }: { className?: string }) => (
4 |
12 | )
13 |
--------------------------------------------------------------------------------
/components/Icons/IconFire.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 |
3 | export const IconFire = ({ className = '' }: { className?: string }) => (
4 |
11 | );
12 |
--------------------------------------------------------------------------------
/components/ui/Input/Input.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 | import { HTMLAttributes } from 'react';
3 |
4 | interface Props extends HTMLAttributes
3 |
17 |
23 | )
24 |
--------------------------------------------------------------------------------
/components/Icons/IconTrash.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 |
3 | export const IconTrash = ({ className = '' }: { className?: string }) => (
4 |
18 | );
19 |
--------------------------------------------------------------------------------
/components/Icons/IconArrowTopRight.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 |
3 | export const IconArrowTopRight = ({ className = '' }: { className?: string }) => (
4 |
21 | )
22 |
--------------------------------------------------------------------------------
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "env": {
3 | "browser": true,
4 | "es2021": true
5 | },
6 | "extends": "standard-with-typescript",
7 | "overrides": [],
8 | "parserOptions": {
9 | "project": "./tsconfig.json",
10 | "ecmaVersion": "latest",
11 | "sourceType": "module"
12 | },
13 | "rules": {
14 | "@typescript-eslint/comma-dangle": "off",
15 | "@typescript-eslint/space-before-function-paren": "off",
16 | "@typescript-eslint/semi": "off",
17 | "@typescript-eslint/strict-boolean-expressions": "off",
18 | "@typescript-eslint/restrict-template-expressions": "off",
19 | "@typescript-eslint/explicit-function-return-type": "off",
20 | "@typescript-eslint/member-delimiter-style": "off",
21 | "@typescript-eslint/array-type": "off",
22 | "space-before-function-paren": "off",
23 | "func-call-spacing": ["error", "never"],
24 | "semi": ["error", "always"]
25 | }
26 | }
27 |
--------------------------------------------------------------------------------
/components/ui/Comment/Comment.Like.tsx:
--------------------------------------------------------------------------------
1 | import { IconHeart } from '@/components/Icons'
2 | import mergeTW from '@/utils/mergeTW'
3 | import { HTMLAttributes, ReactNode } from 'react'
4 |
5 | interface Props extends HTMLAttributesNo results found
18 |No products found for this search term.
19 | 20 | Find more tools 21 | 22 |
16 | {item.name}
17 | {item.slogan}
18 |
19 |
20 | );
21 |
--------------------------------------------------------------------------------
/components/ui/FormLaunch/FormLaunchSection.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 | import { ReactNode } from 'react'
3 |
4 | export const FormLaunchSection = ({
5 | children,
6 | className = '',
7 | number,
8 | title,
9 | description,
10 | }: {
11 | children: ReactNode
12 | className?: string
13 | number: number
14 | title: string
15 | description?: string
16 | }) => (
17 |
19 | {number}
20 |
21 |
22 |
28 |
23 |
26 | {title}
24 |{description}
25 |{children}
27 |
18 |
19 |
26 |
27 | )
28 |
--------------------------------------------------------------------------------
/components/ui/ToolCard/Tool.Name.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import mergeTW from '@/utils/mergeTW';
4 | import { ReactNode } from 'react';
5 | import { ArrowTopRightOnSquareIcon } from '@heroicons/react/24/solid';
6 | import Link from 'next/link';
7 |
8 | export default ({
9 | className,
10 | children,
11 | href,
12 | toolHref,
13 | }: {
14 | className?: string;
15 | href?: string;
16 | toolHref?: string;
17 | children?: ReactNode;
18 | }) => (
19 |
20 | {toolHref ? {children} : children}
21 | window.open(`${href}?ref=devhunt`)}
25 | target="_blank"
26 | className="hidden group-hover/card:block"
27 | >
28 |
31 | );
32 |
--------------------------------------------------------------------------------
/utils/supabase/fileUploader.ts:
--------------------------------------------------------------------------------
1 | import axios from 'axios';
2 | import { type File } from 'buffer';
3 |
4 | export default async ({ files, options }: { files: File | Blob; options?: string }) => {
5 | const formdata = new FormData();
6 |
7 | const fileName = Date.now() + (files as File).name.replaceAll(' ', '-');
8 | formdata.append('image', files as any, fileName);
9 |
10 | try {
11 | const { data } = await axios.post('https://d1gl9g4ciwvjfq.cloudfront.net/api/UploadFile', formdata);
12 | return { file: getCdnImageUrl(data.file.url, options) };
13 | } catch (err) {
14 | console.log(err);
15 | }
16 | };
17 |
18 | // Converts asset url into a imgix url to have better pages loading speed
19 | function getCdnImageUrl(url: string, options?: string) {
20 | return (
21 | url.replace(/'/g, "\\'").replace('https://marscode.s3.eu-north-1.amazonaws.com/assets/img', 'https://mars-images.imgix.net') +
22 | '?auto=compress&fit=max' +
23 | (options ? `&${options}` : '')
24 | );
25 | }
26 |
--------------------------------------------------------------------------------
/components/Icons/IconGoogle.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 |
3 | export const IconGoogle = ({ className = '' }: { className?: string }) => (
4 |
14 | );
15 |
--------------------------------------------------------------------------------
/components/ui/Navbar/ButtonMenu.tsx:
--------------------------------------------------------------------------------
1 | export default ({ isActive, setActive }: { isActive: boolean; setActive: () => void }) => (
2 |
21 | );
22 |
--------------------------------------------------------------------------------
/components/Icons/index.ts:
--------------------------------------------------------------------------------
1 | export * from './IconSearch';
2 | export * from './IconVote';
3 | export * from './IconArrowTopRight';
4 | export * from './IconChartBar';
5 | export * from './IconChatBubbleLeft';
6 | export * from './IconLoading';
7 | export * from './IconGithub';
8 | export * from './IconHeart';
9 | export * from './IconEllipsisVertical';
10 | export * from './IconArrowLongLeft';
11 | export * from './IconArrowLongRight';
12 | export * from './IconPhoto';
13 | export * from './IconXmark';
14 | export * from './IconPlus';
15 | export * from './IconPencilSquare';
16 | export * from './IconTrash';
17 | export * from './IconCalendar';
18 | export * from './IconEye';
19 | export * from './IconInformationCircle';
20 | export * from './IconFire';
21 | export * from './IconGoogle';
22 | export * from './IconChatBubbleOvalLeftEllipsis';
23 | export * from './IconPlay';
24 | export * from './IconCodeBracket';
25 | export * from './IconClipboard';
26 | export * from './IconFirstWinnerBadge';
27 | export * from './IconSecondWinnerBadge';
28 | export * from './IconThirdWinnerBadge';
29 | export * from './IconNewsletterEnvolpe';
30 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2023 MarsX
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/components/supabase/provider.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import type { Session } from '@supabase/auth-helpers-nextjs';
4 | import { createContext, useContext, useState } from 'react';
5 | import type { TypedSupabaseClient } from '@/app/layout';
6 | import { createBrowserClient } from '@/utils/supabase/browser';
7 | import { type Profile } from '@/utils/supabase/types';
8 |
9 | type MaybeSession = Session | null
10 |
11 | interface SupabaseContext {
12 | supabase: TypedSupabaseClient
13 | session: MaybeSession
14 | user: Profile
15 | }
16 |
17 | // @ts-expect-error disable args error
18 | const Context = createContext
24 | {children}
25 |
26 |
27 | );
28 | };
29 |
--------------------------------------------------------------------------------
/components/supabase/listener.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { useRouter } from 'next/navigation';
4 | import { useEffect } from 'react';
5 | import { useSupabase } from './provider';
6 |
7 | // this component handles refreshing server data when the user logs in or out
8 | // this method avoids the need to pass a session down to child components
9 | // in order to re-render when the user's session changes
10 | // #elegant!
11 | export default function SupabaseListener({ serverAccessToken }: { serverAccessToken?: string }): any {
12 | const { supabase } = useSupabase();
13 | const router = useRouter();
14 |
15 | useEffect(() => {
16 | const {
17 | data: { subscription },
18 | } = supabase.auth.onAuthStateChange((event, session) => {
19 | if (session?.access_token !== serverAccessToken) {
20 | // server and client are out of sync
21 | // reload the page to fetch fresh server data
22 | // https://beta.nextjs.org/docs/data-fetching/mutating
23 | router.refresh();
24 | }
25 | });
26 |
27 | return () => {
28 | subscription.unsubscribe();
29 | };
30 | }, [serverAccessToken, router, supabase]);
31 | }
32 |
--------------------------------------------------------------------------------
/utils/helpers.ts:
--------------------------------------------------------------------------------
1 | export function omit(obj: object, keys: string[]): object {
2 | return Object.fromEntries(Object.entries(obj).filter(([k, _]) => !keys.includes(k)));
3 | }
4 |
5 | export function groupBy(array, callbackFn) {
6 | return array.reduce((res, item) => {
7 | const key = callbackFn(item);
8 | (res[key] = res[key] || []).push(item);
9 | return res;
10 | }, {});
11 | }
12 |
13 | export function groupByWithRef(array, callbackFn, refGetter) {
14 | return array.reduce((res, item) => {
15 | const key = callbackFn(item);
16 |
17 | if (!res[key]) {
18 | res[key] = {
19 | ref: refGetter(item),
20 | items: []
21 | };
22 | }
23 |
24 | res[key].items.push(item);
25 |
26 | return res;
27 | }, {});
28 | }
29 |
30 | export function shuffleToolsBasedOnDate(tools) {
31 | if (!tools) {
32 | return [];
33 | }
34 |
35 | const _copy = Array.from(tools);
36 |
37 | for (let i = 0; i < new Date().getDate(); i++) {
38 | _copy.unshift(_copy.pop());
39 | }
40 |
41 | if (_copy.length % 2 === 0 || new Date().getDate() % 2 === 0) {
42 | _copy.reverse();
43 | }
44 |
45 | return _copy;
46 | }
47 |
--------------------------------------------------------------------------------
/components/ui/Blog/Pagination.tsx:
--------------------------------------------------------------------------------
1 | interface PaginationProps {
2 | slug: string;
3 | pageNumber: number;
4 | lastPage: number;
5 | }
6 |
7 | const Pagination: React.FC
10 |
16 | ← Prev
17 |
18 |
30 | );
31 | };
32 |
33 | export default Pagination;
34 |
--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
1 | /** @type {import('tailwindcss').Config} */
2 | module.exports = {
3 | content: ['./pages/**/*.{js,ts,jsx,tsx,mdx}', './components/**/*.{js,ts,jsx,tsx,mdx}', './app/**/*.{js,ts,jsx,tsx,mdx}'],
4 | theme: {
5 | extend: {
6 | backgroundImage: {
7 | 'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
8 | 'gradient-conic': 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
9 | },
10 | keyframes: {
11 | overlayShow: {
12 | from: { opacity: 0 },
13 | to: { opacity: 1 },
14 | },
15 | contentShow: {
16 | from: { opacity: 0, transform: 'translate(-50%, -48%) scale(0.96)' },
17 | to: { opacity: 1, transform: 'translate(-50%, -50%) scale(1)' },
18 | },
19 | },
20 | animation: {
21 | overlayShow: 'overlayShow 150ms cubic-bezier(0.16, 1, 0.3, 1)',
22 | contentShow: 'contentShow 150ms cubic-bezier(0.16, 1, 0.3, 1)',
23 | },
24 | },
25 | },
26 | plugins: [
27 | require('@tailwindcss/typography'),
28 | require('@tailwindcss/forms')({
29 | strategy: 'class', // only generate classes
30 | }),
31 | ],
32 | };
33 |
--------------------------------------------------------------------------------
/components/Icons/IconCalendar.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 |
3 | export const IconCalendar = ({ className = '' }: { className?: string }) => (
4 |
12 | );
13 |
--------------------------------------------------------------------------------
/components/Icons/IconVote.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW'
2 |
3 | export const IconVote = ({ className = '' }: { className?: string }) => (
4 |
23 | )
24 |
--------------------------------------------------------------------------------
/components/ui/AuthProviderButtons/index.tsx:
--------------------------------------------------------------------------------
1 | import { IconGithub, IconGoogle } from '@/components/Icons';
2 | import Button from '@/components/ui/Button/Button';
3 | import mergeTW from '@/utils/mergeTW';
4 | import { HTMLAttributes } from 'react';
5 |
6 | interface ProviderType extends HTMLAttributes
19 | {pageNumber + 1} / {lastPage}
20 |
21 | = lastPage - 1 ? 'pointer-events-none opacity-30' : ''
24 | }`}
25 | href={pageNumber >= lastPage - 1 ? '#' : `${slug}?page=${pageNumber + 2}`}
26 | >
27 | Next →
28 |
29 |
19 |
26 |
34 | )
35 | }
36 |
--------------------------------------------------------------------------------
/components/ui/Banner/Banner.tsx:
--------------------------------------------------------------------------------
1 | import { IconArrowLongRight } from '@/components/Icons';
2 | import LinkItem from '../Link/LinkItem';
3 |
4 | export default () => {
5 | return (
6 | // -
31 | {children}
32 |
7 | //
24 | <>
25 | );
26 | };
27 |
--------------------------------------------------------------------------------
/components/ui/Page404/Page404.tsx:
--------------------------------------------------------------------------------
1 | import Link from 'next/link';
2 |
3 | export default () => {
4 | return (
5 |
8 | //
17 | //
22 | //
23 | //
9 | // 
10 | //
12 | //
10 | // Support our project: Float UI on Product Hunt now
11 | //
18 | // Check it out
19 | //
21 | //
30 |
32 | )
33 | : isTool
34 | ? (
35 | children
36 | )
37 | : (
38 |
15 |
31 |
16 |
17 |
27 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
28 |
29 |
30 |
27 | {tool.name}
28 | {tool.slogan}
29 | c.name),
33 | ]}
34 | />
35 |
36 |
37 |
39 |
32 |
50 | );
51 | };
52 |
--------------------------------------------------------------------------------
/components/ui/ChatWindow/index.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { IconChatBubbleLeft } from '@/components/Icons';
4 | import LinkItem from '../Link/LinkItem';
5 | import { IconChatBubbleOvalLeftEllipsis } from '@/components/Icons';
6 | import { useEffect, useState } from 'react';
7 | import johnPicture from '@/public/johnrush.jpeg';
8 | import Image from 'next/image';
9 | import { XMarkIcon } from '@heroicons/react/24/solid';
10 | import * as Popover from '@radix-ui/react-popover';
11 |
12 | function TwitterLink() {
13 | return (
14 |
19 |
20 |
27 |
28 | );
29 | }
30 |
31 | export default () => {
32 | const [isPopupActive, setPopupActive] = useState(true);
33 |
34 | useEffect(() => {
35 | setTimeout(() => {
36 | setPopupActive(false);
37 | }, 6000);
38 | }, []);
39 |
40 | return (
41 | John Rush
21 |
22 |
26 |
23 |
25 |
43 |
48 | );
49 | };
50 |
--------------------------------------------------------------------------------
/app/api/ph-dev-tools/[slug]/route.ts:
--------------------------------------------------------------------------------
1 | import axios from 'axios';
2 | import { NextResponse } from 'next/server';
3 |
4 | interface RouteParams {
5 | params: {
6 | slug: string;
7 | };
8 | }
9 |
10 | // http://api-v2-docs.producthunt.com.s3-website-us-east-1.amazonaws.com/query/post/
11 |
12 | export async function GET(request: Request, { params }: RouteParams) {
13 | const { slug } = params;
14 | const PH_ACCESS_TOKEN = process.env.PH_ACCESS_TOKEN;
15 |
16 | if (!PH_ACCESS_TOKEN) {
17 | return NextResponse.json({ error: 'ProductHunt access token not configured' }, { status: 500 });
18 | }
19 |
20 | const config = {
21 | headers: {
22 | Authorization: `Bearer ${PH_ACCESS_TOKEN}`,
23 | 'Content-Type': 'application/json',
24 | Accept: 'application/json',
25 | },
26 | };
27 |
28 | const body = {
29 | query: `query { post(slug: "${slug}") {
30 | name
31 | description
32 | url
33 | slug
34 | tagline
35 | website
36 | productLinks {
37 | url
38 | }
39 | thumbnail {
40 | url
41 | }
42 | media {
43 | url
44 | type
45 | }
46 | } }`,
47 | };
48 |
49 | try {
50 | const response = await axios.post('https://api.producthunt.com/v2/api/graphql', body, config);
51 |
52 | const { data } = response.data;
53 |
54 | if (!data.post) {
55 | return NextResponse.json({ error: 'Product not found' }, { status: 404 });
56 | }
57 |
58 | return NextResponse.json({ product: data.post });
59 | } catch (error) {
60 | console.error('Error fetching ProductHunt product:', error);
61 | return NextResponse.json({ error: 'Failed to fetch product' }, { status: 500 });
62 | }
63 | }
64 |
--------------------------------------------------------------------------------
/components/Icons/IconNewsletterEnvolpe.tsx:
--------------------------------------------------------------------------------
1 | import mergeTW from '@/utils/mergeTW';
2 |
3 | export const IconNewsletterEnvolpe = ({ className = '' }: { className?: string }) => (
4 |
32 | );
33 |
--------------------------------------------------------------------------------
/components/ui/LogoUploader/LogoUploader.tsx:
--------------------------------------------------------------------------------
1 | import { ChangeEvent, useRef } from 'react';
2 | import Button from '../Button/Button';
3 | import { IconLoading } from '@/components/Icons';
4 |
5 | export default ({
6 | src,
7 | required = false,
8 | isLoad = false,
9 | onChange,
10 | }: {
11 | src?: string;
12 | required?: boolean;
13 | isLoad?: boolean;
14 | onChange?: (e: ChangeEvent
44 |
47 | {icon || iconVariant[variant]}
45 |
46 |
20 |
53 | );
54 | };
55 |
--------------------------------------------------------------------------------
/components/ui/ImagesUploader/ImagesUploader.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { IconLoading, IconPlus } from '@/components/Icons';
4 | import mergeTW from '@/utils/mergeTW';
5 | import { ChangeEvent, ReactNode, useRef } from 'react';
6 |
7 | export const ImagesUploader = ({
8 | children,
9 | className = '',
10 | onChange,
11 | max = 3,
12 | files = [],
13 | required = false,
14 | isLoad = false,
15 | }: {
16 | children: ReactNode;
17 | className?: string;
18 | max?: number;
19 | files: File[] | [];
20 | required?: boolean;
21 | onChange?: (e: ChangeEvent
21 |
28 |
42 |
52 |
29 |
32 | Tool logo
30 |Recommended size: 220x220 or 210x210 pixels
31 |
33 |
40 |
41 |
28 | {children}
29 | {files?.length < max ? (
30 |
45 | ) : (
46 | ''
47 | )}
48 |
58 |
59 | );
60 | };
61 |
--------------------------------------------------------------------------------
/app/globals.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 |
5 | * {
6 | scroll-behavior: smooth;
7 | }
8 |
9 | /* Customize scrollbar */
10 | *::-webkit-scrollbar {
11 | @apply w-2.5 h-2.5 bg-slate-900 duration-150;
12 | }
13 |
14 | *::-webkit-scrollbar:hover {
15 | @apply bg-slate-800;
16 | }
17 |
18 | *::-webkit-scrollbar-thumb {
19 | @apply bg-slate-700 rounded-full;
20 | }
21 |
22 | .custom-screen {
23 | @apply max-w-screen-xl mx-auto px-4 md:px-8;
24 | }
25 |
26 | .container-custom-screen {
27 | max-width: 54rem;
28 | @apply mx-auto px-4 md:px-8;
29 | }
30 |
31 | ul > li:last-child:last-of-type .comment-divided-bar {
32 | display: none;
33 | }
34 |
35 | .btnshake {
36 | animation: shake 0.82s 3 cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
37 | transform: translate3d(0, 0, 0);
38 | perspective: 1000px;
39 | animation-delay: 1s;
40 | }
41 |
42 | @keyframes shake {
43 | 10%,
44 | 90% {
45 | transform: translate3d(-1px, 0, 0);
46 | }
47 | 20%,
48 | 80% {
49 | transform: translate3d(2px, 0, 0);
50 | }
51 | 30%,
52 | 50%,
53 | 70% {
54 | transform: translate3d(-4px, 0, 0);
55 | }
56 | 40%,
57 | 60% {
58 | transform: translate3d(4px, 0, 0);
59 | }
60 | }
61 |
62 | .animate-bottom-bannner {
63 | animation: bounce 1s infinite;
64 | }
65 |
66 | @keyframes bounce {
67 | 0%,
68 | 100% {
69 | transform: translateY(-10%);
70 | animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
71 | }
72 | 50% {
73 | transform: translateY(0);
74 | animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
75 | }
76 | }
77 |
78 | .catchy-border {
79 | border: 2px solid transparent;
80 | background: linear-gradient(90deg, #fff, #fff), linear-gradient(to bottom right, #60a5fa, #de4f4a);
81 | background-clip: padding-box, border-box;
82 | background-origin: padding-box, border-box;
83 | }
84 |
--------------------------------------------------------------------------------
/components/CodeBlock.tsx:
--------------------------------------------------------------------------------
1 | import Prism from 'prismjs';
2 | import 'prismjs/components/prism-jsx';
3 | import { MouseEventHandler, useEffect, useState } from 'react';
4 | import { IconClipboard } from './Icons';
5 |
6 | type Props = {
7 | children?: string;
8 | onCopy?: () => void;
9 | };
10 |
11 | export default (props: Props) => {
12 | const { children, onCopy = () => {} } = props;
13 |
14 | const [copyState, setCopyState] = useState
41 |
56 |
60 | );
61 | };
62 |
--------------------------------------------------------------------------------
/components/ui/WinnerBadge/index.tsx:
--------------------------------------------------------------------------------
1 | 'use client';
2 |
3 | import { IconFirstWinnerBadge, IconSecondWinnerBadge, IconThirdWinnerBadge } from '@/components/Icons';
4 | import { ProductAward } from '@/utils/supabase/CustomTypes';
5 | import JSConfetti from 'js-confetti';
6 | import { useEffect, useRef, useState } from 'react';
7 |
8 | const badges = {
9 | winner1: {
10 | badge:
57 | {children}
58 |
59 |
44 | {(badges as any)[`winner${weekRank}`].badge}
45 | {(badges as any)[`winner${weekRank}`].rank}
46 | Product of the week
47 |
48 | ) : (
49 | <>
50 | );
51 | };
52 |
--------------------------------------------------------------------------------
/components/ui/Blog/ArticleCard.tsx:
--------------------------------------------------------------------------------
1 | import { ArrowSmallRightIcon } from '@heroicons/react/24/outline';
2 | import Link from 'next/link';
3 |
4 | interface ArticleProps {
5 | article: any;
6 | }
7 |
8 | const ArticleCard: React.FC
12 |
13 | Published{' '}
14 | {new Date(article.publishedAt || article.createdAt).toLocaleDateString('en-US', {
15 | day: 'numeric',
16 | month: 'short',
17 | year: 'numeric',
18 | })}
19 |
20 | {article.readingTime ? {` ⦁ ${article.readingTime}`} min read : null}
21 |
22 |
23 | {article.headline}
24 | 25 |{article.metaDescription}
26 |
27 |
43 |
28 | {(article.tags || []).splice(0, 3).map((t: any, ix: number) => (
29 |
34 | {t.title}
35 |
36 | ))}
37 |
38 |
39 | Read More
40 |
13 |
46 | );
47 |
--------------------------------------------------------------------------------
/app/blog/page.tsx:
--------------------------------------------------------------------------------
1 | import ArticleCard from '@/components/ui/Blog/ArticleCard';
2 | import Pagination from '@/components/ui/Blog/Pagination';
3 | import { type Metadata } from 'next';
4 | import { BlogClient } from 'seobot';
5 |
6 | export async function generateMetadata(): Promise
14 |
20 |
16 |
19 | {profile?.full_name || 'DevHunt user'}
17 |{profile?.headline}
18 |
21 |
45 | {profile?.about}
22 |
23 |
24 |
29 |
33 |
34 |
39 |
43 |
44 | DevHunt's Blog
50 |-
51 | {posts.map((article: any) => (
52 |
33 |
52 | ,
53 | document.body,
54 | )
55 | ) : (
56 | <>
57 | );
58 | };
59 |
--------------------------------------------------------------------------------
/components/ui/UploadAvatar/UploadAvatar.tsx:
--------------------------------------------------------------------------------
1 | import Button from '@/components/ui/Button/Button'
2 | import { useRef } from 'react'
3 | import Avatar from '../Avatar/Avatar'
4 |
5 | type Props = {
6 | avatarUrl: string
7 | avatarPreview?: string
8 | selectedImage?: File | null
9 | setSelectedImage?: (val: File | null) => void
10 | setAvatarPreview?: (val: string) => void
11 | }
12 |
13 | export default ({ avatarUrl, avatarPreview, setSelectedImage = () => '', setAvatarPreview = () => '' }: Props) => {
14 | const inputRef = useRef
35 |
51 |
36 | {variant == 'default' ? (
37 |
50 |
38 |
45 | ) : (
46 | ''
47 | )}
48 | {variant == 'custom' ? children : ''}
49 | {icon}
39 |
40 |
44 | {title}
41 |{description}
42 |{children}
43 |
38 |
41 |
63 | )
64 | }
65 |
--------------------------------------------------------------------------------
/app/api/ph-dev-tools/get-website-url/[url]/route.ts:
--------------------------------------------------------------------------------
1 | import request from 'request';
2 | import { NextRequest, NextResponse } from 'next/server';
3 |
4 | interface RouteParams {
5 | params: {
6 | url: string;
7 | };
8 | }
9 |
10 | function extractLink(url: string) {
11 | // Regular expression to match URLs with "www." or without any protocol
12 | const regex = /^(?:https?:\/\/)?(?:www\.)?(.*)/;
13 |
14 | // Extract the domain from the URL using regex
15 | const matches = url.match(regex);
16 |
17 | // If matches found, construct the link with "https://" prefix
18 | if (matches && matches.length > 1) {
19 | const domain = matches[1];
20 | return `https://${domain}`;
21 | }
22 |
23 | // If no matches found, return the original URL
24 | return url;
25 | }
26 |
27 | function extractHostAndPath(url: string): { host: string; path: string } {
28 | const regex = /^(?:https?:\/\/)?([^\/?#]+)(\/[^?#]*)?/;
29 | const matches = url.match(regex);
30 |
31 | if (matches && matches.length >= 2) {
32 | const host = matches[1];
33 | const path = matches[2] || '/'; // Default to '/' if path is not provided
34 | return { host, path };
35 | } else {
36 | throw new Error('Invalid URL format');
37 | }
38 | }
39 |
40 | export async function GET(req: NextRequest, { params }: RouteParams) {
41 | const { url } = params;
42 |
43 | console.log('Website URL', url.replace(/\?.*$/, ''));
44 |
45 | const requests = (website: string) => {
46 | // Return a promise for each request
47 | return new Promise((resolve, reject) => {
48 | // Perform the request asynchronously
49 | request({ url: website.replace(/\?.*$/, ''), followRedirect: false }, function (err, res, body) {
50 | if (err) {
51 | reject(err);
52 | } else {
53 | console.log('res.headers', res.headers);
54 |
55 | resolve(extractLink(extractHostAndPath(res.headers.location as string).host));
56 | }
57 | });
58 | });
59 | };
60 |
61 | const realWebsite = await requests(url);
62 |
63 | console.log(realWebsite);
64 |
65 | return NextResponse.json(realWebsite);
66 | }
67 |
--------------------------------------------------------------------------------
/app/all-dev-tools/page.tsx:
--------------------------------------------------------------------------------
1 | import ProductsService from '@/utils/supabase/services/products';
2 | import ToolCardEffect from '@/components/ui/ToolCardEffect/ToolCardEffect';
3 | import { ProductType } from '@/type';
4 | // import { shuffleToolsBasedOnDate } from '@/utils/helpers';
5 | import { createBrowserClient } from '@/utils/supabase/browser';
6 | import Pagination from '@/components/ui/Blog/Pagination';
7 |
8 | const { title, description, ogImage } = {
9 | title: 'Explore the best Dev Tools on Dev Hunt',
10 | description: 'A launchpad for dev tools, built by developers for developers, open source, and fair.',
11 | ogImage: 'https://devhunt.org/devhuntog.png?v=2',
12 | };
13 |
14 | export const metadata = {
15 | title,
16 | description,
17 | openGraph: {
18 | title,
19 | description,
20 | images: [ogImage],
21 | url: 'https://devhunt.org',
22 | },
23 | twitter: {
24 | card: 'summary_large_image',
25 | title,
26 | description,
27 | images: [ogImage],
28 | },
29 | };
30 |
31 | export default async function Page({ searchParams }: { searchParams: { page: number } }) {
32 | const pageCount = Math.max((searchParams.page || 0) - 1, 0);
33 | const productService = new ProductsService(createBrowserClient());
34 | const products = await productService.getProducts('votes_count', false, 50, pageCount || 1);
35 |
36 | const numberOfItems = products.count;
37 | const numberPerPage = 50;
38 | const numberOfPages = Math.ceil(numberOfItems / numberPerPage);
39 |
40 | return (
41 |
42 |
45 | {avatarPreview ? (
46 |
49 | ) : (
50 | ''
51 | )}
52 |
53 | handleFileSelected(e)}
61 | />
62 |
43 |
45 |
46 | All DevTools on Dev Hunt
44 |
47 |
53 | -
48 | {products.data.map((product: ProductType, idx: number) => (
49 |
Our Open-source Friends
33 |
34 | {data.map((item: OSSFriend, key: number) => (
35 |
41 |
51 | {item.name}
42 |{item.description}
43 |
44 |
47 |
48 |
49 | ))}
50 |
52 |
57 | Wanna join OSS Friends?
58 |
59 |
60 |
29 |
50 |
51 |
30 |
37 | 31 | World #1 launchpad for dev tools and open source projects. 32 |
33 |34 | Loved by developers and growing. 35 |
36 |
38 |
49 | -
39 | {
40 | stats.map((item, idx) => (
41 |
-
42 |
{item.data}
43 |{item.desc}
44 |
45 | ))
46 | }
47 |
8 |
9 |
10 |
11 |
19 | );
20 |
21 | function MonitizorAdCards() {
22 | const [loaded, setLoaded] = useState(false);
23 |
24 | useEffect(() => {
25 | setTimeout(() => {
26 | setLoaded(true);
27 | }, 500);
28 | // setLoaded(true); // Only enable rendering after hydration
29 | }, []);
30 |
31 | const iframe = <>
32 |
36 |
40 |
49 | ;
50 |
51 | if (!loaded) {
52 | return
12 |
13 |
14 |
15 |
16 |
17 |
18 |
53 |
;
60 | }
61 |
62 | return iframe;
63 | }
64 |
65 | export default MonitizorAdCards;
66 |
--------------------------------------------------------------------------------
/pages/api/chat-gpt.ts:
--------------------------------------------------------------------------------
1 | import type { NextApiRequest, NextApiResponse } from 'next';
2 | import ProductsService from '@/utils/supabase/services/products';
3 | import { createBrowserClient } from '@/utils/supabase/browser';
4 | import { Product } from '@/utils/supabase/types';
5 | import { ExtendedProduct } from '@/utils/supabase/CustomTypes';
6 | import {checkAuthToken} from "@/pages/api/auth-token";
7 |
8 | export interface ChatGptDto {
9 | status: string
10 | message: string
11 | data: ChatGtpDtoData
12 | }
13 |
14 | export interface ChatGtpDtoData {
15 | date: string
16 | tools: ChatGtpDtoDataTool[]
17 | footer: string
18 | }
19 |
20 | export interface ChatGtpDtoDataTool {
21 | tool_id: number
22 | name: string
23 | description: string
24 | image_link: string
25 | date_added: string
26 | developer: string
27 | upvotes: string
28 | upvote_link: string
29 | }
30 |
31 | function prepareSuccessDto(input: string, tools: ExtendedProduct[]): ChatGtpDto {
32 | return {
33 | status: 'success',
34 | message: `Tools containing "${input}" in any way`,
35 | data: {
36 | tools: tools.map((t: ExtendedProduct) => ({
37 | tool_id: t.id,
38 | name: t.name,
39 | description: t.description,
40 | image_link: t.logo_url,
41 | data_added: new Date(t.created_at).toISOString().split('T')[0],
42 | developer: t.profiles.full_name,
43 | upvotes: t.votes_count || '-',
44 | upvote_link: `https://devhunt.org/tool/${t.slug}`
45 | })),
46 | footer: 'Discover your next tool https://devhunt.org/ '
47 | }
48 | };
49 | }
50 |
51 | export default async function handler(req: NextApiRequest, res: NextApiResponse) {
52 |
53 | let { input } = req.query;
54 |
55 | const errorPayload = {
56 | status: 'error',
57 | data: null
58 | };
59 |
60 | if (!input) {
61 | input = '';
62 | }
63 |
64 | const tools = await new ProductsService(createBrowserClient()).getToolsByNameOrDescription(input as string, 10);
65 |
66 | if (!tools) {
67 | res.json({ ...errorPayload, message: 'Nothing found' });
68 | }
69 |
70 | res.json(prepareSuccessDto(input as string, tools as ExtendedProduct[]));
71 | }
72 |
--------------------------------------------------------------------------------
/utils/supabase/services/categories.ts:
--------------------------------------------------------------------------------
1 | import BaseDbService from './BaseDbService';
2 | import type {
3 | InsertProductCategory,
4 | InsertProductCategoryProduct,
5 | Product,
6 | ProductCategory,
7 | ProductCategoryProduct,
8 | } from '@/utils/supabase/types';
9 | import {cache} from "@/utils/supabase/services/CacheService";
10 |
11 | export default class CategoryService extends BaseDbService {
12 | async getProducts(categoryId: number): Promise
54 |
59 | {iframe}
58 |
50 |
55 | {isToolViewActive ?
51 | {children}
52 |
53 |
54 |
48 |
59 |
49 |
58 |
50 |
55 | Log in to your account
52 |We use GitHub, and Google provider to filter out bots and fakes.
53 |Read the Rules for voting and what dev tools you can submit here
54 |
33 |
34 |
47 |
37 | {tool.name}
38 |
39 | {tool.slogan}
40 |
41 |
42 | c.name)]} />
43 |
45 |
46 |
52 |
54 |
36 |
47 |
66 | ) : (
67 | <>
68 | );
69 | };
70 |
--------------------------------------------------------------------------------
/utils/categories.ts:
--------------------------------------------------------------------------------
1 | const categories: { name: string; description: string }[] = [
2 | { name: 'Open Source', description: 'Tools related to open source development.' },
3 | { name: 'DevOps', description: 'Tools for optimizing and automating the software development lifecycle.' },
4 | { name: 'AI', description: 'Artificial Intelligence and Machine Learning tools.' },
5 | { name: 'CI', description: 'Continuous Integration tools for automated testing and deployment.' },
6 | { name: 'Code', description: 'Tools related to coding and programming.' },
7 | { name: 'NoCode', description: 'Tools that allow building applications without coding.' },
8 | { name: 'Analytics', description: 'Tools for collecting and analyzing data.' },
9 | { name: 'QA', description: 'Quality Assurance and testing tools.' },
10 | { name: 'API', description: 'Tools for working with APIs (Application Programming Interfaces).' },
11 | { name: 'DB', description: 'Database management tools and frameworks.' },
12 | { name: 'Design', description: 'Tools for graphic and user interface design.' },
13 | { name: 'Helpers', description: 'Various helper tools for developers.' },
14 | { name: 'Hosting', description: 'Services and platforms for hosting applications and websites.' },
15 | { name: 'UI Library', description: 'User Interface component libraries and frameworks.' },
16 | { name: 'Marketing', description: 'Tools for marketing and promoting products.' },
17 | { name: 'Emails', description: 'Email marketing and communication tools.' },
18 | { name: 'Framework', description: 'Development frameworks for building applications.' },
19 | { name: 'Language', description: 'Programming languages and related tools.' },
20 | { name: 'Crypto', description: 'Cryptocurrency and blockchain-related tools.' },
21 | { name: 'Web3', description: 'Web3 development tools for decentralized applications.' },
22 | { name: 'Charts', description: 'Charting and visualization libraries.' },
23 | { name: 'IDE', description: 'Integrated Development Environments for coding.' },
24 | { name: 'Monitoring', description: 'Tools for monitoring and observability.' },
25 | { name: 'Workflow automation', description: 'Automation tools for workflows and processes.' },
26 | { name: 'CMS', description: 'Content Management Systems for building and managing websites.' },
27 | { name: 'Security', description: 'Security tools and practices for protecting applications.' },
28 | { name: 'Tailwind CSS', description: 'Utility-first CSS framework.' },
29 | { name: 'Boilerplate', description: 'Starter code templates for new projects.' },
30 | ];
31 |
32 | export default categories;
33 |
--------------------------------------------------------------------------------
/components/ui/SelectLaunchDate/index.tsx:
--------------------------------------------------------------------------------
1 | import { useEffect, useState } from 'react';
2 | import { IconCalendar } from '@/components/Icons';
3 | import mergeTW from '@/utils/mergeTW';
4 | import moment from 'moment';
5 | import { type HTMLAttributes } from 'react';
6 | import { createBrowserClient } from '@/utils/supabase/browser';
7 | import ProductsService from '@/utils/supabase/services/products';
8 |
9 | interface Props extends HTMLAttributes-
48 | {navigation.map((item, idx) => (
49 |
-
50 |
54 | {item.title} 55 | 56 |
57 | ))}
58 |
64 |
40 |
57 | );
58 | };
59 |
60 | {
61 | /* */
64 | }
65 |
--------------------------------------------------------------------------------
/app/blog/tag/[slug]/page.tsx:
--------------------------------------------------------------------------------
1 | import ArticleCard from '@/components/ui/Blog/ArticleCard';
2 | import Pagination from '@/components/ui/Blog/Pagination';
3 | import { type Metadata } from 'next';
4 | import Link from 'next/link';
5 | import { ChevronRightIcon } from '@heroicons/react/24/outline';
6 | import { BlogClient } from 'seobot';
7 |
8 | async function getPosts(slug: string, page: number) {
9 | const key = process.env.SEOBOT_API_KEY;
10 | if (!key) throw Error('SEOBOT_API_KEY enviroment variable must be set');
11 |
12 | const client = new BlogClient(key);
13 | return await client.getTagArticles(slug, page, 10);
14 | }
15 |
16 | function deslugify(str: string) {
17 | return str.replace(/-/g, ' ').replace(/\b\w/g, char => char.toUpperCase());
18 | }
19 |
20 | export async function generateMetadata({ params: { slug } }: { params: { slug: string } }): Promise
59 |
60 | Home
61 |
62 |
67 | Tag: {slug}
68 |-
69 | {posts.map((article: any) => (
70 |
59 |
60 | Home
61 |
62 |
67 | Category: {slug}
68 |-
69 | {posts.map((article: any) => (
70 |
-
37 | {trendingTools?.map(group => (
38 |
-
41 |
42 | 55 |43 |53 |44 | 45 |52 |{tool.name} 46 |{tool.slogan} 47 |48 | 51 |c.name)]} /> 49 | 50 | 54 |
56 | ))}
57 |
39 | {(group as { products: ProductType[] }).products.map((tool: ProductType, idx: number) => (
40 |
58 | ))}
59 | -
36 | {trendingTools?.map(group => (
37 |
-
42 |
43 | e.preventDefault()} href={'/tool/' + tool.slug} className="w-full flex items-center gap-x-4"> 44 | 56 |45 | 46 |53 | 54 |{tool.name} 47 |{tool.slogan} 48 |49 | 52 |c.name)]} /> 50 | 51 | 55 |
57 |
58 | ))}
59 |
38 | {(group as { products: ProductType[] }).products.map((tool: ProductType, idx: number) => (
39 | <>
40 | {idx === 3 && }
41 |
60 | ))}
61 |
55 |
58 |
59 | The upcoming tools
56 |Browse the upcoming tools, and be in update with the next.
57 |
60 | {launchWeeks.map(group => (
61 | <>
62 |
76 |
63 | {group.startDate.toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' })}
64 |
65 | -
66 | {/* {shuffleToolsBasedOnDate(group.products).map((product, idx) => (
67 |
Best {getOriginalSlug(slug)} tools
66 |-
68 | {products.map((product: Product, idx: number) => (
69 |
71 | {user ? (
72 |
75 | ) : (
76 |
77 | Login to comment
78 |
79 | )}
80 |
81 |
Comments, support and feedback
26 |