From d0d18d74461f63a3cd83cd7e6c3ac21612a78520 Mon Sep 17 00:00:00 2001 From: ganesshkumar Date: Fri, 27 Dec 2024 17:17:54 -0800 Subject: [PATCH] prettier fixes --- components/AllPluinsList.tsx | 26 +- components/Divider.tsx | 4 +- components/FavPluginUpdates.tsx | 4 +- components/Footer.tsx | 22 +- components/Header.tsx | 3 +- components/InfoBar.tsx | 59 +- components/Navbar.tsx | 324 +++++----- components/NewPluginCard.tsx | 4 +- components/NewPluginsList.tsx | 46 +- components/PluginTable.tsx | 58 +- data/indexnow.json | 2 +- data/wrapped-2024.json | 2 +- lib/posts.ts | 7 +- pages/index.tsx | 168 ++++-- pages/plugins/[slug].tsx | 291 ++++++--- pages/plugins/index.tsx | 89 +-- pages/posts/2024-12-07-wrapped-2024.tsx | 568 ++++++++++++------ pages/posts/[slug].tsx | 36 +- pages/posts/index.tsx | 39 +- pages/share.tsx | 68 ++- pages/tags/[slug].tsx | 11 +- pages/trending.tsx | 23 +- pages/updates.tsx | 4 +- posts/2024-12-07-wrapped-2024.md | 2 +- posts/2024-12-08-weekly-plugin-updates.md | 7 +- ...7-obsidian-plugins-for-daily-journaling.md | 6 +- posts/2024-12-15-weekly-plugin-updates.md | 7 +- ...4-12-18-writing-stats-essential-plugins.md | 2 +- posts/2024-12-22-weekly-plugin-updates.md | 7 +- utils/generate-rss.js | 14 +- utils/indexnow.mjs | 101 ++-- utils/plugins.ts | 2 +- 32 files changed, 1279 insertions(+), 727 deletions(-) diff --git a/components/AllPluinsList.tsx b/components/AllPluinsList.tsx index 8964c52..6db3f0e 100644 --- a/components/AllPluinsList.tsx +++ b/components/AllPluinsList.tsx @@ -5,7 +5,20 @@ import { memo } from 'react'; import { VList } from 'virtua'; import { getDescription } from '../utils/plugins'; -const AllPluginsList = ({ plugins, favorites, setFavorites }) => { +const highlightMatch = (name, query) => { + const parts = name.split(new RegExp(`(${query})`, 'gi')); + return parts.map((part, index) => + part.toLowerCase() === query.toLowerCase() ? ( + + {part} + + ) : ( + part + ) + ); +}; + +const AllPluginsList = ({ plugins, favorites, setFavorites, highlight }) => { return (
@@ -16,6 +29,7 @@ const AllPluginsList = ({ plugins, favorites, setFavorites }) => { index={index} favorites={favorites} setFavorites={setFavorites} + highlight={highlight} /> ))} @@ -24,7 +38,7 @@ const AllPluginsList = ({ plugins, favorites, setFavorites }) => { }; const UnindexedPlugin = (props) => { - const { plugin, favorites, setFavorites, index } = props; + const { plugin, favorites, setFavorites, index, highlight } = props; return (
{ href={`/plugins/${plugin.pluginId}`} className="text-xl font-semibold text-violet-800" > - {plugin.name} + {highlight ? highlightMatch(plugin.name, highlight) : plugin.name}
by {plugin.author} @@ -44,7 +58,11 @@ const UnindexedPlugin = (props) => { setFavorites={setFavorites} />
-
{getDescription(plugin)}
+
+ {highlight + ? highlightMatch(getDescription(plugin), highlight) + : getDescription(plugin)} +
(
@@ -6,4 +6,4 @@ const Divider = () => (
); -export default Divider; \ No newline at end of file +export default Divider; diff --git a/components/FavPluginUpdates.tsx b/components/FavPluginUpdates.tsx index 3f1c254..e84a21b 100644 --- a/components/FavPluginUpdates.tsx +++ b/components/FavPluginUpdates.tsx @@ -23,12 +23,12 @@ const FavPluginUpdates = (props) => { return ( <> {/* Helper to add favorite plugins */} - {favorites && favorites.length == 0 && + {favorites && favorites.length == 0 && ( <> - } + )} {/* Updates for your favorite plugins */} {/* {updatesForFavPlugins && updatesForFavPlugins.length > 0 && ( diff --git a/components/Footer.tsx b/components/Footer.tsx index b938cdd..6535fde 100644 --- a/components/Footer.tsx +++ b/components/Footer.tsx @@ -38,14 +38,20 @@ const AppFooter = () => { Latest Updates - - Most Downloaded + + Favorite Plugins - - Tags + + Most Downloaded - Trending + Trending Plugins + + + Plugin Tags
@@ -62,7 +68,11 @@ const AppFooter = () => {
- © 2022-{new Date().getFullYear()} Obsidian Plugin Stats. All rights reserved. + © 2022-{new Date().getFullYear()}{' '} + + Obsidian Plugin Stats + + . All rights reserved.
Made with 💜 by{' '} diff --git a/components/Header.tsx b/components/Header.tsx index d03b8ce..6167f0a 100644 --- a/components/Header.tsx +++ b/components/Header.tsx @@ -75,7 +75,8 @@ const Header = (props) => { return ( - Obsidian Plugin Stats - Explore New, Updated, Trending and Most Downloaded Obsidian Plugins + Obsidian Plugin Stats - Explore New, Updated, Trending and Most + Downloaded Obsidian Plugins ( <> @@ -26,24 +26,49 @@ const Content = ({ title }) => ( ); -const className = "group relative z-20 scroll-mt-20 text-3xl font-bold text-gray-800 dark:text-white capitalize my-4"; -const id = "default-table"; +const className = + 'group relative z-20 scroll-mt-20 text-3xl font-bold text-gray-800 dark:text-white capitalize my-4'; +const id = 'default-table'; -const InfoBar = ({ title, as = "h1" }: IInfoBarProps) => { +const InfoBar = ({ title, as = 'h1' }: IInfoBarProps) => { switch (as) { - case "h6": - return
; - case "h5": - return
; - case "h4": - return

; - case "h3": - return

; - case "h2": - return

; - case "h1": + case 'h6': + return ( +
+ +
+ ); + case 'h5': + return ( +
+ +
+ ); + case 'h4': + return ( +

+ +

+ ); + case 'h3': + return ( +

+ +

+ ); + case 'h2': + return ( +

+ +

+ ); + case 'h1': default: - return

; + return ( +

+ +

+ ); } }; diff --git a/components/Navbar.tsx b/components/Navbar.tsx index 5b71f59..e3974d0 100644 --- a/components/Navbar.tsx +++ b/components/Navbar.tsx @@ -1,5 +1,11 @@ import React, { useState } from 'react'; -import { CustomFlowbiteTheme, Dropdown, Navbar, Modal, Button } from 'flowbite-react'; +import { + CustomFlowbiteTheme, + Dropdown, + Navbar, + Modal, + Button, +} from 'flowbite-react'; import Constants from '../constants'; import Image from 'next/image'; import { Rss, HelpCircle } from 'react-feather'; @@ -26,161 +32,179 @@ const NavBar = ({ current, children }: INavbarProps) => { return ( <> -
- - - {`${Constants.AppName} - - {Constants.AppName} - - - - - - New Plugins - - - Posts - - - Favorites - - - All Plugins - -
  • - - More -
    • - } +
    + + + {`${Constants.AppName} + + {Constants.AppName} + + + + + - - - Latest Updates - - - - - Most Downloaded - - - - - Trending - - - - + + Posts + + + Favorites + + + All Plugins + +
  • + + More +
    • + } + > + + + Latest Updates + + + + + Most Downloaded + + + + + Trending + + + + + Tags + + + + + {children && children} + + + + + +
    + {current === 'home' && ( + <> + {/* Sponsored Ad Placeholder */} +
    +
    +

    Your Ad Here

    +

    + Interested in promoting your content?{' '} + - Tags - - - - - {children && children} - - - - - -

    - {current === 'home' && - <> - {/* Sponsored Ad Placeholder */} -
    -
    -

    Your Ad Here

    -

    - Interested in promoting your content?{' '} - - Contact us - {' '} - for sponsorship opportunities. - -

    + Contact us + {' '} + for sponsorship opportunities. + +

    +
    -
    - {/* Modal */} - - Why We Need Sponsorship - -
    - Our platform is dedicated to keeping the community informed and up-to-date on the latest developments in the Obsidian ecosystem. -
    - Key features include: -
      • Backend system that actively monitors new plugin releases and updates. -
      • Ensuring timely and accurate information delivery. -
      • Weekly posts highlighting new plugins. -
      • Comprehensive resources, such as the "Wrapped 2024" report. + {/* Modal */} + + Why We Need Sponsorship + +
    + Our platform is dedicated to keeping the community informed and + up-to-date on the latest developments in the Obsidian ecosystem. +
    + Key features include: +
    +   • Backend system that actively monitors new plugin + releases and updates. +
    +   • Ensuring timely and accurate information + delivery. +
    +   • Weekly posts highlighting new plugins. +
    +   • Comprehensive resources, such as the "Wrapped + 2024" report. +
    -
    -
    -
    - Your sponsorship directly supports these efforts by helping us cover operational costs and enabling us to continue delivering high-quality, valuable content to the community. -
    - With your support, we can -
      • Sustain and expand our offerings. -
      • Keep the community engaged, informed, and inspired. +
    +
    + Your sponsorship directly supports these efforts by + helping us cover operational costs and enabling us to continue + delivering high-quality, valuable content to the community. +
    + With your support, we can +
    +   • Sustain and expand our offerings. +
    +   • Keep the community engaged, informed, and + inspired. +
    -
    - - - - - - - } + + + + + + + )} ); }; diff --git a/components/NewPluginCard.tsx b/components/NewPluginCard.tsx index b7dd756..d30813f 100644 --- a/components/NewPluginCard.tsx +++ b/components/NewPluginCard.tsx @@ -17,7 +17,9 @@ const NewPluginCard = ({ plugin, isFavorite, isTrending, showDescription }) => { {moment(plugin.createdAt).fromNow()} by{' '} {plugin.author}
    - {showDescription &&
    {plugin.description}
    } + {showDescription && ( +
    {plugin.description}
    + )} ); }; diff --git a/components/NewPluginsList.tsx b/components/NewPluginsList.tsx index f222ab4..9179cb7 100644 --- a/components/NewPluginsList.tsx +++ b/components/NewPluginsList.tsx @@ -41,7 +41,7 @@ const NewPluginsList = ({ ); }; -const Plugin = (props) => { +const Plugin = (props) => { const { plugin, idx, pad, favorites, setFavorites, showDownloadStat } = props; return ( @@ -81,42 +81,46 @@ const UnindexedPlugin = (props) => {
    {showDownloadStat && (
    - {' '} + + + {' '} {plugin.totalDownloads.toLocaleString()}
    )} - {(plugin.aiCategories || plugin.aiTags) && + {(plugin.aiCategories || plugin.aiTags) && (
    - {plugin.aiCategories && + {plugin.aiCategories && (
    - } + )}
    - {plugin.aiCategories && + {plugin.aiCategories && (
    - Category: {plugin.aiCategories} + Category:{' '} + {plugin.aiCategories}
    - } - {plugin.aiTags && + )} + {plugin.aiTags && (
    - {plugin.aiTags && plugin.aiTags?.split(',').map((tag) => ( - - # - {tag} - - ))} + {plugin.aiTags && + plugin.aiTags?.split(',').map((tag) => ( + + # + {tag} + + ))}
    - } + )}
    - } + )}
    {getDescription(plugin)}
    {plugins.map((plugin, idx) => ( - {plugin.name} + + {plugin.name} + ))} Description {plugins.map((plugin) => ( - {plugin.description} + + {plugin.description} + ))} Created {plugins.map((plugin) => ( - {moment(plugin.createdAt).format("DD MMM YYYY")} + + {moment(plugin.createdAt).format('DD MMM YYYY')} + ))} Downloads {plugins.map((plugin) => ( -
    +
    {plugin.totalDownloads.toLocaleString()}
    ))} - + Category {plugins.map((plugin) => ( -
    - {plugin.aiCategories} +
    + + {plugin.aiCategories}
    ))} @@ -64,29 +71,48 @@ const PluginsTable = ({ Tags {plugins.map((plugin) => ( -
    - {plugin.aiTags.split(',').map(t => #{t})} +
    + {plugin.aiTags.split(',').map((t) => ( + + #{t} + + ))}
    ))} - Detailed Description + + Detailed Description + {plugins.map((plugin) => ( - {plugin.aiDescription} + + {plugin.aiDescription} + ))} Author {plugins.map((plugin) => ( - {plugin.author} + + {plugin.author} + ))} Link {plugins.map((plugin) => ( - Open Plugin + + Open Plugin + ))} diff --git a/data/indexnow.json b/data/indexnow.json index 6f62391..803d9ba 100644 --- a/data/indexnow.json +++ b/data/indexnow.json @@ -1,3 +1,3 @@ { "lastSubmission": "2024-12-16T17:55:21.594Z" -} \ No newline at end of file +} diff --git a/data/wrapped-2024.json b/data/wrapped-2024.json index e174db9..8f3e940 100644 --- a/data/wrapped-2024.json +++ b/data/wrapped-2024.json @@ -893,4 +893,4 @@ } ] } -} \ No newline at end of file +} diff --git a/lib/posts.ts b/lib/posts.ts index 94572e7..1bac8bd 100644 --- a/lib/posts.ts +++ b/lib/posts.ts @@ -52,10 +52,13 @@ export function getPostData(id: string): PostData { export function getAllPostIds() { const fileNames = fs.readdirSync(postsDirectory); - const jsxFileNames = fs.readdirSync(postsJsxDirectory).filter(fileName => fileName !== "[slug].tsx" && fileName !== "index.jsx").map(fileName => fileName.replace(/\.tsx$/, '')); + const jsxFileNames = fs + .readdirSync(postsJsxDirectory) + .filter((fileName) => fileName !== '[slug].tsx' && fileName !== 'index.jsx') + .map((fileName) => fileName.replace(/\.tsx$/, '')); return fileNames - .filter(fileName => !jsxFileNames.includes(fileName.replace(/\.md$/, ''))) + .filter((fileName) => !jsxFileNames.includes(fileName.replace(/\.md$/, ''))) .map((fileName) => { return { params: { diff --git a/pages/index.tsx b/pages/index.tsx index 2c4e213..2b3457a 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -57,17 +57,41 @@ const Home = (props) => {
    -
    Obsidian Plugin - Wrapped 2024
    - -
    -
    - logo +
    + Obsidian Plugin - Wrapped 2024 +
    + +
    +
    + logo +
    +
    + 2024 has been a monumental year for the Obsidian community, with + over 750+ newly releaased plugins now shaping how we create, + organize, and think. These incredible tools are a testament to the + hard work, creativity, and meticulous care of our dedicated + developers. Let’s take a moment to celebrate their passion and the + transformative impact they've had on our workflows—this is your + achievement! 🎉
    -
    2024 has been a monumental year for the Obsidian community, with over 750+ newly releaased plugins now shaping how we create, organize, and think. These incredible tools are a testament to the hard work, creativity, and meticulous care of our dedicated developers. Let’s take a moment to celebrate their passion and the transformative impact they've had on our workflows—this is your achievement! 🎉
    -
    - - See Wrapped 2024 +
    + + + See Wrapped 2024 +
    @@ -108,7 +132,7 @@ const Home = (props) => { {/* Most Downloaded */}
    - +
    Here are the 25 most downloaded plugins ever since the beginning of Obsidian Editor. @@ -161,7 +185,7 @@ const Home = (props) => { {/* FAQ */}
    - +
    @@ -179,7 +203,7 @@ const NewPluginsSection = ({ newPlugins }) => { return (
    - +
    There are {newPlugins?.length || 0} new plugins from the last 10 days
    @@ -215,11 +239,11 @@ const NewPluginsSection = ({ newPlugins }) => {
    - {plugin.aiCategories && + {plugin.aiCategories && (
    - } + )}
    {plugin.description}
    @@ -251,14 +275,17 @@ const NewVersionsSection = ({ newReleases }) => { setupFavorites(setFavorites); }, []); - const sortedNewReleases = newReleases.sort((a, b) => favorites.includes(a.pluginId) ? -1 : 1); + const sortedNewReleases = newReleases.sort((a, b) => + favorites.includes(a.pluginId) ? -1 : 1 + ); return (
    - There are {sortedNewReleases?.length || 0} new plugins from the last 10 days + There are {sortedNewReleases?.length || 0} new plugins from the last + 10 days
    {sortedNewReleases.slice(0, 12).map((newRelease, idx) => { @@ -284,7 +311,7 @@ const NewVersionsSection = ({ newReleases }) => { 'all 0.25s cubic-bezier(0.17, 0.55, 0.55, 1) 0.25s', }} > -
    +
    @@ -301,9 +328,12 @@ const NewVersionsSection = ({ newReleases }) => {
    -
    @@ -325,7 +355,7 @@ const NewVersionsSection = ({ newReleases }) => { ); }; -const TrendingPlugins = ({plugins}) => { +const TrendingPlugins = ({ plugins }) => { const [offsetX, setOffsetX] = React.useState(0); const speed = 0.05; // Adjust speed of the scroll const containerWidth = 3100; // Width of the scrolling content (calculated to avoid jumps) @@ -350,61 +380,75 @@ const TrendingPlugins = ({plugins}) => { const translateX = offsetX % containerWidth; return ( -
    + ); }; const PostIcon = (props) => { if (props.tags && props.tags.includes('weekly-plugin-updates')) { - return + return ( + + ); } else if (props.tags && props.tags.includes('wrapped-yearly-post')) { - return + return ( + + ); } else if (props.tags && props.tags.includes('workflow')) { - return - } - else { - return undefined + return ( + + ); + } else { + return undefined; } -} +}; -const NewPosts = ({posts}) => { +const NewPosts = ({ posts }) => { return (
    @@ -420,7 +464,9 @@ const NewPosts = ({posts}) => {
    -
    {post.title}
    +
    + {post.title} +
    {moment(post.publishedDate).format('MMMM DD, YYYY')}
    @@ -433,13 +479,10 @@ const NewPosts = ({posts}) => { ))} - +
    - ) -} + ); +}; export const getStaticProps = async () => { const plugins = await PluginsCache.get(); @@ -462,10 +505,11 @@ export const getStaticProps = async () => { const tags = new Set(); plugins.forEach((plugin) => { - plugin?.aiTags && plugin?.aiTags - .split(',') - .map((tag) => sanitizeTag(tag)) - .forEach((tag) => tags.add(tag)); + plugin?.aiTags && + plugin?.aiTags + .split(',') + .map((tag) => sanitizeTag(tag)) + .forEach((tag) => tags.add(tag)); }); const newPosts = getSortedPostsData().slice(0, 5); @@ -484,7 +528,7 @@ export const getStaticProps = async () => { mostDownloaded, totalTagsCount: tags.size, trendingPlugins, - newPosts + newPosts, }, }; }; diff --git a/pages/plugins/[slug].tsx b/pages/plugins/[slug].tsx index 27f298d..1f08717 100644 --- a/pages/plugins/[slug].tsx +++ b/pages/plugins/[slug].tsx @@ -13,7 +13,20 @@ import NewPluginCard from '../../components/NewPluginCard'; import { getDescription, sanitizeTag, tagDenyList } from '../../utils/plugins'; import { isNotXDaysOld } from '../../utils/datetime'; -import { Download, DownloadCloud, Star, GitHub, Edit2, GitBranch, PlusCircle, GitCommit, RefreshCcw, GitPullRequest, Disc, Activity } from 'react-feather'; +import { + Download, + DownloadCloud, + Star, + GitHub, + Edit2, + GitBranch, + PlusCircle, + GitCommit, + RefreshCcw, + GitPullRequest, + Disc, + Activity, +} from 'react-feather'; import { Card, CustomFlowbiteTheme, Navbar, Tooltip } from 'flowbite-react'; import { PluginsCache } from '../../cache/plugins-cache'; import { CategoryIcon } from '../../components/Category'; @@ -46,9 +59,12 @@ const Plugin = (props) => { .then((data) => { // replace any relative image urls of the markdown cotnent with absolute urls const regex = /!\[.*?\]\((?!http)(.*?)\)/g; - const newData = data.replace(regex, `![$1](https://raw.githubusercontent.com/${props.plugin.repo}/${defaultBranch}/$1)`); - - setReadmeContent(newData) + const newData = data.replace( + regex, + `![$1](https://raw.githubusercontent.com/${props.plugin.repo}/${defaultBranch}/$1)` + ); + + setReadmeContent(newData); }); }, []); @@ -122,7 +138,8 @@ const Plugin = (props) => { href={`obsidian://show-plugin?id=${props.plugin.pluginId}`} className="text-violet-50 flex justify-center items-center space-x-2s my-2 py-1 border border-violet-800 px-2 rounded-md bg-violet-800 transition hover:scale-110" > - Install + {' '} + Install { )}
    Description
    - {props.plugin.aiCategories && + {props.plugin.aiCategories && (
    - +
    - } + )}
    - {props.plugin.aiCategories && + {props.plugin.aiCategories && (
    - Category: {props.plugin.aiCategories} + Category:{' '} + + {props.plugin.aiCategories} +
    - } - {props.plugin.aiTags && + )} + {props.plugin.aiTags && (
    - {props.plugin.aiTags && props.plugin.aiTags?.split(',').map((tag) => ( - - # - {tag} - - ))} + {props.plugin.aiTags && + props.plugin.aiTags?.split(',').map((tag) => ( + + # + {tag} + + ))}
    - } + )}
    - +
    {
    Stats
    -
    +
    -
    +
    -
    {props.plugin.stargazers}
    +
    + {props.plugin.stargazers} +
    stars
    - -
    + +
    -
    {props.plugin.totalDownloads?.toLocaleString()}
    +
    + {props.plugin.totalDownloads?.toLocaleString()} +
    downloads
     - -
    + +
    -
    {props.plugin.forks?.toLocaleString() || '0'}
    +
    + {props.plugin.forks?.toLocaleString() || '0'} +
    forks
     - -
    + +
    -
    {moment(props.plugin.createdAt).days().toLocaleString()}
    +
    + {moment(props.plugin.createdAt).days().toLocaleString()} +
    days
     - -
    + +
    -
    {moment(props.plugin.lastCommitAt).days().toLocaleString()}
    +
    + {moment(props.plugin.lastCommitAt).days().toLocaleString()} +
    days
     - -
    + +
    -
    {moment(props.plugin.latestReleaseAt).days().toLocaleString()}
    +
    + {moment(props.plugin.latestReleaseAt) + .days() + .toLocaleString()} +
    days
     - -
    - -
    {props.plugin.totalPR?.toLocaleString() ?? '0'}
    + +
    + +
    + {props.plugin.totalPR?.toLocaleString() ?? '0'} +
    total PRs
     - -
    - -
    {props.plugin.openPR?.toLocaleString() ?? '0'}
    + +
    + +
    + {props.plugin.openPR?.toLocaleString() ?? '0'} +
    open PRs
     - -
    - -
    {props.plugin.closedPR?.toLocaleString() ?? '0'}
    + +
    + +
    + {props.plugin.closedPR?.toLocaleString() ?? '0'} +
    closed PRs
     - -
    - -
    {props.plugin.mergedPR?.toLocaleString() ?? '0'}
    + +
    + +
    + {props.plugin.mergedPR?.toLocaleString() ?? '0'} +
    merged PRs
     - -
    + +
    -
    {props.plugin.totalIssues?.toLocaleString() ?? '0'}
    +
    + {props.plugin.totalIssues?.toLocaleString() ?? '0'} +
    total issues
     - -
    + +
    -
    {props.plugin.openIssues?.toLocaleString() ?? '0'}
    +
    + {props.plugin.openIssues?.toLocaleString() ?? '0'} +
    open issues
     - -
    + +
    -
    {props.plugin.closedIssues?.toLocaleString() ?? '0'}
    +
    + {props.plugin.closedIssues?.toLocaleString() ?? '0'} +
    closed issues
     - -
    + +
    -
    {props.plugin.commitCountInLastYear?.toLocaleString() ?? '0'}
    +
    + {props.plugin.commitCountInLastYear?.toLocaleString() ?? + '0'} +
    commits
     @@ -320,7 +418,9 @@ const Plugin = (props) => { {props.plugin.latestRelease}
    -
    {moment(props.plugin.latestReleaseAt).fromNow()}
    +
    + {moment(props.plugin.latestReleaseAt).fromNow()} +
    Changelog
    {
    - +
    README file from
    @@ -365,7 +465,10 @@ const Plugin = (props) => { {props.similarPlugins?.length > 3 && (
    -
    Similar Plugins
    +
    + {' '} + Similar Plugins +
    info
    @@ -408,7 +511,9 @@ export const getStaticProps = async ({ params }) => { const plugins = await PluginsCache.get(); const plugin = plugins.find((plugin) => plugin.pluginId === params.slug); - const tags = plugin.aiTags ? plugin.aiTags.split(',').map((tag) => sanitizeTag(tag)) : []; + const tags = plugin.aiTags + ? plugin.aiTags.split(',').map((tag) => sanitizeTag(tag)) + : []; const similarPlugins = plugins.filter( (p) => diff --git a/pages/plugins/index.tsx b/pages/plugins/index.tsx index e9db85c..9a7111e 100644 --- a/pages/plugins/index.tsx +++ b/pages/plugins/index.tsx @@ -39,21 +39,18 @@ const exactMatch = (query: string, text: string) => { if (!query || !text) { return false; } - const regex = new RegExp(`\\b${query}\\b`, "i"); + const regex = new RegExp(`\\b${query}\\b`, 'i'); return regex.test(text); }; -const queryPlugins = ( - query: string, - plugins: any[] = [], -): any[] => { +const queryPlugins = (query: string, plugins: any[] = []): any[] => { if (!query) { return plugins; } const result = []; const helperSet = new Set(); - + const addToResult = (plugins) => { plugins.forEach((plugin) => { if (!helperSet.has(plugin.pluginId)) { @@ -63,28 +60,46 @@ const queryPlugins = ( }); }; - addToResult(plugins.filter((plugin) => { - return exactMatch(query, plugin.name); - })); - addToResult(plugins.filter((plugin) => { - return exactMatch(query, plugin.description); - })); + addToResult( + plugins.filter((plugin) => { + return exactMatch(query, plugin.name); + }) + ); + addToResult( + plugins.filter((plugin) => { + return exactMatch(query, plugin.description); + }) + ); - const queryParts = query.split(" ").filter((part) => !!part); - addToResult(queryParts - .map((part) => plugins.filter((plugin) => exactMatch(part, plugin.name))) - .flat() + const queryParts = query.split(' ').filter((part) => !!part); + addToResult( + queryParts + .map((part) => plugins.filter((plugin) => exactMatch(part, plugin.name))) + .flat() ); - addToResult(queryParts - .map((part) => plugins.filter((plugin) => exactMatch(part, plugin.description))) - .flat() + addToResult( + queryParts + .map((part) => + plugins.filter((plugin) => exactMatch(part, plugin.description)) + ) + .flat() ); - - addToResult(plugins - .filter((plugin) => plugin.name?.toLowerCase().split(" ").some((part) => part.startsWith(query.toLowerCase()))) + + addToResult( + plugins.filter((plugin) => + plugin.name + ?.toLowerCase() + .split(' ') + .some((part) => part.startsWith(query.toLowerCase())) + ) ); - addToResult(plugins - .filter((plugin) => plugin.description?.toLowerCase().split(" ").some((part) => part.startsWith(query.toLowerCase()))) + addToResult( + plugins.filter((plugin) => + plugin.description + ?.toLowerCase() + .split(' ') + .some((part) => part.startsWith(query.toLowerCase())) + ) ); return result; @@ -112,15 +127,18 @@ const Plugins = (props) => { return true; } return plugin.aiCategories === filterCategoryOptions[filterCategory]; - }) - // .filter((plugin) => { - // return ( - // plugin.name.toLowerCase().includes(filterLowerCase) || - // plugin.description.toLowerCase().includes(filterLowerCase) - // ); - // }); + }); + // .filter((plugin) => { + // return ( + // plugin.name.toLowerCase().includes(filterLowerCase) || + // plugin.description.toLowerCase().includes(filterLowerCase) + // ); + // }); - const plugins = queryPlugins(filterLowerCase, favAndCategoryFilteredPlugins); + const plugins = queryPlugins( + filterLowerCase, + favAndCategoryFilteredPlugins + ); plugins.sort((a, b) => { switch (sortby) { @@ -181,7 +199,7 @@ const Plugins = (props) => { if (filter.length === 0 && e.target.value.length === 1) { setSortby('relevance'); } - setFilter(e.target.value) + setFilter(e.target.value); }} />
    @@ -312,11 +330,11 @@ const Plugins = (props) => { inline size="sm" > - {sortby === 'relevance' && + {sortby === 'relevance' && ( {sortByOptions['relevance']} - } + )} setSortby('alphabet_asc')}> {sortByOptions['alphabet_asc']} @@ -333,6 +351,7 @@ const Plugins = (props) => {
    { return ( <> -
    { ); -} +}; const Intro = () => { const { scrollYProgress } = useScroll(); - const scale = useTransform(scrollYProgress, [0, .5], [1, 20]); + const scale = useTransform(scrollYProgress, [0, 0.5], [1, 20]); const opacity = useTransform(scrollYProgress, [0, 0.3], [1, 0]); const imageScale = useTransform(scrollYProgress, [0, 0.5], [1, 0]); - const buttonOpacity = useTransform(scrollYProgress, [0, 0.5], [1, 0]) + const buttonOpacity = useTransform(scrollYProgress, [0, 0.5], [1, 0]); const [showParticles, setShowParticles] = useState(false); const handleOpenClick = () => { if (document) { - document.getElementById("milestone").scrollIntoView({ behavior: "smooth" }); + document + .getElementById('milestone') + .scrollIntoView({ behavior: 'smooth' }); } - } + }; useEffect(() => { setShowParticles(true); - }) + }); const Categories = [ - "Task Management", - "File Management", - "Note Enhancements", - "Data Visualization", - "3rd Party Integrations", - "Productivity Tools", - "Coding & Technical Tools", - "Creative & Writing Tools", - "Privacy & Security", - "Customization & UI", - "Collaboration & Sharing", - "Learning & Knowledge Management", - "Miscellaneous", - "Uncategorized", - ]; + 'Task Management', + 'File Management', + 'Note Enhancements', + 'Data Visualization', + '3rd Party Integrations', + 'Productivity Tools', + 'Coding & Technical Tools', + 'Creative & Writing Tools', + 'Privacy & Security', + 'Customization & UI', + 'Collaboration & Sharing', + 'Learning & Knowledge Management', + 'Miscellaneous', + 'Uncategorized', + ]; const particles = Array.from({ length: 50 }); return ( -
    -
    Obsidian Wrapped 2024
    +
    +
    + Obsidian Wrapped 2024 +
    { duration: 0.8, delay: 0.5, ease: [0, 0.71, 0.2, 1.01], - }}> - - - Obsidian Plugins Stats Logo + }} + > + + Obsidian Plugins Stats Logo - {showParticles && + {showParticles && ( <> {particles.map((_, index) => { return ( @@ -100,48 +143,82 @@ const Intro = () => { transition={{ duration: Math.random() * 5 + 2, repeat: Infinity, - repeatType: "loop", - ease: "easeInOut", + repeatType: 'loop', + ease: 'easeInOut', }} - > - + > + ); })} - } + )}
    - + whileHover={{ scale: 1.2 }} + whileTap={{ scale: 0.8 }} + style={{ opacity: buttonOpacity }} + > +
    - ) -} + ); +}; const MilestonesSection = (props) => { return ( -
    +
    -
    Milestones achived in 2024
    +
    + Milestones achived in 2024 +
      -
    • Crossed {props.milestone.totalPlugins.toLocaleString()} published plugins.
      • -
    • Surpassed {props.milestone.totalDownloads.toLocaleString()} plugin downloads.
      • -
    +
  • + Crossed{' '} + + {props.milestone.totalPlugins.toLocaleString()} + {' '} + published plugins. +
    • +
  • + Surpassed{' '} + + {props.milestone.totalDownloads.toLocaleString()} + {' '} + plugin downloads. +
    • +
    - +
    - ) -} + ); +}; const StatsSection = (props) => { const ref1 = useRef(null); @@ -153,227 +230,349 @@ const StatsSection = (props) => { const ref4 = useRef(null); const isInView4 = useInView(ref4, { once: true }); return ( -
    +
    In 2024
    • - -
      {props.stats.newPluginsDevCount.toLocaleString()}
      -
      {" "} Developers contributed
      +
      + {props.stats.newPluginsDevCount.toLocaleString()} +
      +
      + Developers contributed +
    • - -
      {props.stats.newPluginsCount.toLocaleString()}
      -
      {" "} New Plugins
      +
      + {props.stats.newPluginsCount.toLocaleString()} +
      +
      + New Plugins +
    • - -
      {props.stats.updatedPluginsCount.toLocaleString()}
      -
      {" "} Plugin Updates
      +
      + {props.stats.updatedPluginsCount.toLocaleString()} +
      +
      + Plugin Updates +
    • - -
      {props.stats.downloadCount.toLocaleString()}
      -
      {" "} Plugin Downloads
      +
      + {props.stats.downloadCount.toLocaleString()} +
      +
      + Plugin Downloads +
      • -
    +
    - +
    - ) -} + ); +}; const MostDownloadedPluginsFromNewPluginsSection = (props) => { return ( -
    +
    • -
      Top New Plugins Released in 2024
      +
      + Top New Plugins Released in 2024 +
      • - {Object.keys(props.mostDownloadedFromNewPlugins).map((pludingId, idx) => { - return ( -
    • -
      - {idx + 1}. - {props.mostDownloadedFromNewPlugins[pludingId].name} - - {props.mostDownloadedFromNewPlugins[pludingId].delta.toLocaleString()} - Downloads - -
      -
      • - ) - })} + {Object.keys(props.mostDownloadedFromNewPlugins).map( + (pludingId, idx) => { + return ( +
    • +
      + {idx + 1}. + + + {props.mostDownloadedFromNewPlugins[pludingId].name} + + + + + {props.mostDownloadedFromNewPlugins[ + pludingId + ].delta.toLocaleString()} + + Downloads + +
      +
      • + ); + } + )}
    - ) -} - + ); +}; const MostDownloadedPluginsSection = (props) => { return ( -
    +
    - ) -} - + ); +}; const MostUpdatedPluginsSection = (props) => { return ( -
    +
    • -
      Plugins received most updates in 2024
      +
      + Plugins received most updates in 2024 +
      • {Object.keys(props.mostUpdated).map((pludingId, idx) => { return (
    • {idx + 1}. - {props.mostUpdated[pludingId].name} + + + {props.mostUpdated[pludingId].name} + + - {props.mostUpdated[pludingId].totalUpdated.toLocaleString()} + + {props.mostUpdated[ + pludingId + ].totalUpdated.toLocaleString()} + Updates
      • - ) + ); })}
    - ) -} + ); +}; const MostPluginsByAuthorSection = (props) => { return ( -
    +
    -
    Developers who created most plugins
    -
    -
    - Obsidian Plugins Stats Logo +
    + Developers who created most plugins
    -
    - {Object.entries(props.mostPluginsByAuthor) - .map((data: [string, any[]], index: number) => { - return ( -
    -
    - {data[0]} - created - -
    -
    - {data[1].map((plugin, index) => { - return ( - {plugin.name} - ) - })} +
    +
    + Obsidian Plugins Stats Logo +
    +
    + {Object.entries(props.mostPluginsByAuthor).map( + (data: [string, any[]], index: number) => { + return ( +
    +
    + + {data[0]} + + created + +
    +
    + {data[1].map((plugin, index) => { + return ( + + {plugin.name} + + ); + })} +
    +
    + } + > +
    + {data[1].length} plugins.
    -
    - } - > -
    {data[1].length} plugins.
    - -
    -
    - ) - })} + +
    +
    + ); + } + )} +
    -
    - ) -} + ); +}; const Section = (props) => { const handleNextSectionClick = () => { if (document) { if (props.nextSectionId) { - document.getElementById(props.nextSectionId)?.scrollIntoView({ behavior: "smooth" }); + document + .getElementById(props.nextSectionId) + ?.scrollIntoView({ behavior: 'smooth' }); } else { - document.getElementById("milestone")?.scrollIntoView({ behavior: "smooth" }); + document + .getElementById('milestone') + ?.scrollIntoView({ behavior: 'smooth' }); } } - } + }; return ( { >
    -
    +
    -
    Obsidian Plugins
    -
    2024 Wrapped
    +
    + Obsidian Plugins +
    +
    + 2024 Wrapped +
    +
    +
    + Obsidian Plugins - 2024 Wrapped
    -
    Obsidian Plugins - 2024 Wrapped
    {props.children} - {props.nextSectionId ? - - - : - - + {props.nextSectionId ? ( + + - } + ) : ( + + + + )}
    ); -} - +}; export const getStaticProps = async () => { const data = require('../../data/wrapped-2024.json'); @@ -413,6 +639,6 @@ export const getStaticProps = async () => { return { props: { ...data }, }; -} +}; -export default Demo +export default Demo; diff --git a/pages/posts/[slug].tsx b/pages/posts/[slug].tsx index 96572c7..42db1a2 100644 --- a/pages/posts/[slug].tsx +++ b/pages/posts/[slug].tsx @@ -41,10 +41,11 @@ export const getStaticProps: GetStaticProps = async ({ params }) => { const processedContent = await remark().use(html).process(postData.content); const contentHtml = processedContent.toString(); - const plugins = await PluginsCache.get(); - const filteredPlugins = postData.plugins - ?.map((pluginId) => plugins.find((p) => p.pluginId === pluginId)) - .filter((plugin) => !!plugin) ?? []; + const plugins = await PluginsCache.get(); + const filteredPlugins = + postData.plugins + ?.map((pluginId) => plugins.find((p) => p.pluginId === pluginId)) + .filter((plugin) => !!plugin) ?? []; return { props: { @@ -52,7 +53,7 @@ export const getStaticProps: GetStaticProps = async ({ params }) => { ...postData, contentHtml, }, - plugins: filteredPlugins + plugins: filteredPlugins, }, }; }; @@ -80,17 +81,26 @@ const Post: React.FC = ({ postData, plugins }) => {
    Published: {moment(postData.publishedDate).format('DD-MMM-YYYY')}
    - {plugins && plugins.length ? + {plugins && plugins.length ? ( <> - - {comparePlugins && + + {comparePlugins && (
    - p.pluginId)} plugins={plugins} favorites={[]} setFavorites={() => {}} /> + p.pluginId)} + plugins={plugins} + favorites={[]} + setFavorites={() => {}} + />
    - } - : - null - } + )} + + ) : null}
    diff --git a/pages/posts/index.tsx b/pages/posts/index.tsx index d9d543b..ccc8fae 100644 --- a/pages/posts/index.tsx +++ b/pages/posts/index.tsx @@ -64,9 +64,13 @@ const Blog: React.FC = ({ allPostsData }) => {
    -
    {post.title}
    +
    + {post.title} +
    - {moment(post.publishedDate).format('MMMM DD, YYYY')} + {moment(post.publishedDate).format( + 'MMMM DD, YYYY' + )}
    {post.excerpt} @@ -89,24 +93,23 @@ const Blog: React.FC = ({ allPostsData }) => { const PostIcon = (props) => { if (props.tags && props.tags.includes('weekly-plugin-updates')) { - return + return ( + + ); } else if (props.tags && props.tags.includes('wrapped-yearly-post')) { - return + return ( + + ); } else if (props.tags && props.tags.includes('workflow')) { - return - } - else { - return undefined + return ( + + ); + } else { + return undefined; } -} +}; export default Blog; diff --git a/pages/share.tsx b/pages/share.tsx index ed838f0..b3ddc2e 100644 --- a/pages/share.tsx +++ b/pages/share.tsx @@ -1,10 +1,10 @@ -'use client' +'use client'; import React, { useEffect, useState } from 'react'; import Header from '../components/HeaderAll'; import Navbar from '../components/Navbar'; -import { useSearchParams } from 'next/navigation' +import { useSearchParams } from 'next/navigation'; import Footer from '../components/Footer'; import { setupFavorites } from '../utils/favorites'; import { Tabs } from 'flowbite-react'; @@ -22,28 +22,37 @@ const customTheme: CustomFlowbiteTheme['tabs'] = { variant: { default: { active: { - "on": "bg-gray-100 text-violet-600 dark:bg-gray-800 dark:text-violet-500" - } + on: 'bg-gray-100 text-violet-600 dark:bg-gray-800 dark:text-violet-500', + }, }, underline: { active: { - "on": "active rounded-t-lg border-b-2 border-violet-600 text-violet-600 dark:border-violet-500 dark:text-violet-500" - } - } - } - } + on: 'active rounded-t-lg border-b-2 border-violet-600 text-violet-600 dark:border-violet-500 dark:text-violet-500', + }, + }, + }, + }, }, }; const Plugins = (props) => { - const searchParams = useSearchParams() - const pluginIds: string[] = (props?.pluginIds || searchParams.get('plugins')?.split(',').map(p => p.trim())) ?? [] - const author = searchParams.get('author') - const title = searchParams.get('title') + const searchParams = useSearchParams(); + const pluginIds: string[] = + (props?.pluginIds || + searchParams + .get('plugins') + ?.split(',') + .map((p) => p.trim())) ?? + []; + const author = searchParams.get('author'); + const title = searchParams.get('title'); - const filteredPlugins = pluginIds.map(pluginId => props.plugins.find(p => p.pluginId === pluginId)).filter(p => !!p) ?? [] + const filteredPlugins = + pluginIds + .map((pluginId) => props.plugins.find((p) => p.pluginId === pluginId)) + .filter((p) => !!p) ?? []; const [favorites, setFavorites] = useState([]); - + useEffect(() => { setupFavorites(setFavorites); }, []); @@ -55,16 +64,21 @@ const Plugins = (props) => {
    - +
    - {title && - - } - {author && -
    {author} has shared {filteredPlugins.length} plugins.
    - } - + {title && } + {author && ( +
    + {author} has shared {filteredPlugins.length} plugins. +
    + )} +