Merge branch 'main' into Deep

rupali-codes · Aug 9, 2023 · f5db944 · f5db944
2 parents fd8a82d + 15a3408
commit f5db944
Show file tree

Hide file tree

Showing 15 changed files with 146 additions and 27 deletions.
diff --git a/.github/workflows/spellcheck.yml b/.github/workflows/spellcheck.yml
@@ -0,0 +1,24 @@
+name: Spellcheck
+
+on:
+  push:
+    branches:
+      - main # Adjust this branch name if needed
+  pull_request:
+    types:
+      - opened
+      - synchronize
+
+jobs:
+  spellcheck:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+
+      - name: Install codespell
+        run: pip install codespell
+
+      - name: Run spellcheck
+        run: codespell --quiet-level=2 --check-filenames -- ./**/*.json
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -178,6 +178,54 @@ When adding _YouTube_ channel link, please specify _the language_ of the channel
 
 ---
 
+### Commit Message Guidelines using Commitlint
+
+We follow a standardized commit message format using Commitlint to ensure consistency and clarity in our commit history. Each commit message should adhere to the following guidelines:
+
+1. **Type**: The commit type must be one of the following:
+
+   - `feat`: A new feature or enhancement.
+   - `fix`: A bug fix.
+   - `docs`: Documentation changes.
+   - `style`: Code style changes (e.g., formatting, semicolons).
+   - `refactor`: Code refactorings with no feature changes or bug fixes.
+   - `test`: Adding or improving tests.
+   - `chore`: General maintenance tasks, build changes, etc.
+
+2. **Scope** (Optional): The scope provides context for the commit, indicating the specific part of the project being affected. Use a short description in lowercase (e.g., `auth`, `navbar`, `README`).
+
+3. **Description**: A brief and meaningful description of the changes made. Start with a capital letter and use the imperative mood (e.g., "Add new feature" instead of "Added new feature").
+
+4. **Issue reference** (Optional): Include the issue number associated with the commit (e.g., `#123`).
+
+### Examples:
+
+#### Valid Commit Messages:
+
+- `feat: Add user authentication feature`
+- `fix(auth): Resolve login page redirect issue`
+- `docs: Update installation instructions`
+- `style: Format code according to project guidelines`
+- `refactor(navbar): Improve responsiveness`
+- `test: Add unit tests for API endpoints`
+- `chore: Update dependencies to latest versions`
+- `fix: Handle edge case in data processing (#456)`
+
+#### Invalid Commit Messages:
+
+- `Added new stuff`
+- `Fixed a bug`
+- `Updated code`
+- `auth feature update`
+- `chore: fixed some stuff`
+
+### Commit Example with Commitlint:
+
+```bash
+git commit -m "feat(auth): Implement user signup process (#789)"
+```
+  <hr>
+
 ## Remarks ✅
 
 - If something is missing here, or you feel something is not well described, either create a PR, [raise an issue](https://github.com/rupali-codes/LinksHub/issues), or [do a code review of the person’s PR](https://www.freecodecamp.org/news/code-review-tips/) (ensure that your review conforms to the [Code of Conduct](https://github.com/CBID2/LinksHub-my-version-/blob/main/CODE_OF_CONDUCT.md))
diff --git a/components/BackToTop/BackToTopButton.tsx b/components/BackToTop/BackToTopButton.tsx
@@ -52,6 +52,8 @@ export const BackToTopButton = () => {
       <button
         className={buttonClasses}
         onClick={handleClick}
+        title="Back to top"
+        aria-label="Back to top button"
         data-tooltip-id="btn-tooltip"
         data-tooltip-content="Back to Top"
         data-tooltip-place="top"

diff --git a/components/Footer/Footer.tsx b/components/Footer/Footer.tsx
@@ -19,11 +19,17 @@ export const Footer: FC = () => {
           href="https://linkfree.io/rupali-codes"
           target="_blank"
           rel="noopener noreferrer"
+          aria-label="GitHub Profile of Rupali Haldiya"
         >
           <span className={nameStyles}>Rupali Haldiya</span>
         </Link>{' '}
         and{' '}
-        <Link href="/contributors" rel="noopener noreferrer" target="_blank">
+        <Link
+          href="/contributors"
+          rel="noopener noreferrer"
+          target="_blank"
+          aria-label="List of Contributors in LinksHub"
+        >
           <span className={nameStyles}>Open Source Community</span>
         </Link>
       </p>

diff --git a/components/Header/Header.tsx b/components/Header/Header.tsx
@@ -13,7 +13,7 @@ export const Header: FC = () => {
   return (
     <header className="fixed top-0 left-0 z-30 row-start-1 row-end-2 flex h-[76px] w-screen items-center justify-between bg-light-primary dark:bg-dark">
       <div className="bg-[rgba(255,255,255,0.3)] h-full w-fit flex-none px-6 py-4 dark:bg-dark lg:w-[290px]">
-        <Link href="/">
+        <Link href="/" aria-label="LinksHub Logo">
           <Logo className="text-3xl" />
         </Link>
       </div>
@@ -25,6 +25,7 @@ export const Header: FC = () => {
           <button
             className="dark:text-text-primary lg:hidden"
             onClick={toggleNav}
+            aria-label="toggle button"
           >
             <AiOutlineMenu size={24} />
           </button>

diff --git a/components/NewIssue/NewIssue.tsx b/components/NewIssue/NewIssue.tsx
@@ -5,13 +5,14 @@ const NewIssue: FC = () => {
   return (
     <div className="pt-6 md:p-0 text-xl w-fit m-auto">
       <span>Be the first to add by creating a GitHub issue </span>
-        <Link 
-           className="dark:text-theme-primary text-theme-secondary underline"
-          href="https://github.com/rupali-codes/LinksHub/issues/new?assignees=&labels=add+link&template=add_link.yml&title=%5BAdd%5D+%3Cname%3E"
-          target="_blank"
-        >
-          here
-        </Link>
+      <Link
+        className="dark:text-theme-primary text-theme-secondary underline"
+        href="https://github.com/rupali-codes/LinksHub/issues/new?assignees=&labels=add+link&template=add_link.yml&title=%5BAdd%5D+%3Cname%3E"
+        target="_blank"
+        aria-label="Page to create new Issue"
+      >
+        here
+      </Link>
     </div>
   )
 }

diff --git a/components/Searchbar/Searchbar.tsx b/components/Searchbar/Searchbar.tsx
@@ -67,8 +67,10 @@ export const Searchbar: React.FC<SearchbarProps> = ({ setSearch }) => {
   return (
     <form onSubmit={handleSubmit} noValidate>
       <div className="relative">
-        <div className="flex items-center" aria-role="search">
-          <label htmlFor="simple-search" className="sr-only">Quickly search any resources</label>
+        <div className="flex items-center" role="search">
+          <label htmlFor="simple-search" className="sr-only">
+            Quickly search any resources
+          </label>
           <input
             type="text"
             id="simple-search"
@@ -83,6 +85,7 @@ export const Searchbar: React.FC<SearchbarProps> = ({ setSearch }) => {
           <button
             type="submit"
             className="ml-2 px-4 py-2.5 bg-theme-secondary text-light-primary rounded-md border border-dashed border-transparent hover:border-theme-primary hover:bg-transparent hover:text-theme-primary dark:hover:text-theme-primary transition-colors duration-300 ease-in-out"
+            aria-label="submit query button"
           >
             <SearchIcon className="w-5 h-5" aria-hidden="true" />
           </button>

diff --git a/components/Share/Share.tsx b/components/Share/Share.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React from 'react'
 import { FiShare2 } from 'react-icons/fi'
 import { Tooltip } from 'react-tooltip'
 
@@ -8,7 +8,7 @@ type ShareProps = {
 }
 
 export const Share: React.FC<ShareProps> = ({ url, title }) => {
-  const [showShareOptions, setShowShareOptions] = useState(false)
+  const showShareOptions = false
 
   async function handleShare() {
     if (navigator.share) {
@@ -34,15 +34,29 @@ export const Share: React.FC<ShareProps> = ({ url, title }) => {
         display: 'inline-block',
       }}
     >
-      <button data-tooltip-id="share-tooltip" data-tooltip-content="Share" data-tooltip-place="bottom">
-      <FiShare2
-        size={'1.2rem'}
-        className="text-theme-primary cursor-pointer"
-        onClick={handleShare}
+      <button
+        data-tooltip-id="share-tooltip"
+        data-tooltip-content="Share"
+        data-tooltip-place="bottom"
+      >
+        <FiShare2
+          size={'1.2rem'}
+          className="text-theme-primary cursor-pointer"
+          onClick={handleShare}
+        />
+      </button>
+      <Tooltip
+        id="share-tooltip"
+        style={{
+          backgroundColor: '#8b5cf6',
+          fontSize: '13px',
+          paddingLeft: '6px',
+          paddingRight: '6px',
+          paddingTop: '2px',
+          paddingBottom: '2px',
+        }}
       />
-        </button>
-      <Tooltip id='share-tooltip' style={{ backgroundColor: '#8b5cf6', fontSize: '13px', paddingLeft: '6px', paddingRight: '6px', paddingTop: '2px', paddingBottom: '2px' }} />
-
+
       {showShareOptions && (
         <p
           className="bg-theme-secondary text-white text-sm rounded-lg px-3 py-1"

diff --git a/components/SideNavbar/SideNavbarBody.tsx b/components/SideNavbar/SideNavbarBody.tsx
@@ -10,8 +10,13 @@ export const SideNavbarBody: FC = () => {
   const { setSearch, searchResults, debouncedSearch } = useSidebarSearch()
 
   return (
-    <div className="bg-[rgba(255,255,255,0.3)] w-full overflow-x-hidden whitespace-nowrap transition-all ease-in dark:bg-dark dark:text-text-primary">
-      <div className="bg-light-primary p-4 pt-0 transition-all ease-in dark:bg-dark">
+    <div
+      className={classNames(
+        `bg-[rgba(243,244,246,1)] h-full w-full overflow-x-hidden whitespace-nowrap transition-all ease-in dark:bg-dark dark:text-text-primary`,
+        theme === 'light' ? 'scrollColorLight' : 'scrollColorDark'
+      )}
+    >
+      <div className="bg-primary-light transiton-all w-full p-4 transition-none ease-in dark:bg-dark">
         <Searchbar setSearch={setSearch} />
       </div>
 

diff --git a/components/SideNavbar/SideNavbarCategory.tsx b/components/SideNavbar/SideNavbarCategory.tsx
@@ -27,6 +27,7 @@ export const SideNavbarCategory: FC<{
       <button
         className="flex w-full cursor-pointer justify-between py-2"
         onClick={handleToggle}
+        aria-label="toggle category"
       >
         <h1 className="font-bold uppercase">{item.category}</h1>
         <FaAngleDown

diff --git a/components/SideNavbar/SideNavbarElement.tsx b/components/SideNavbar/SideNavbarElement.tsx
@@ -11,6 +11,7 @@ export const SideNavbarElement = ({ name, url }: SubCategories) => {
   return (
     <Link
       href={url}
+      aria-label="Side Navbar Elements"
       onClick={closeNav}
       className={`${
         router.asPath === url

diff --git a/components/SideNavbar/SideNavbarHeader.tsx b/components/SideNavbar/SideNavbarHeader.tsx
@@ -12,12 +12,13 @@ export const SideNavbarHeader: FC = () => {
   return (
     <header>
       <div className="flex items-center justify-between bg-gray-100 p-4 dark:bg-gray-900">
-        <Link href={'/'}>
+        <Link href={'/'} aria-label="Side Navbar Header Linking with Logo">
           <Logo className="text-3xl" />
         </Link>
         <button
           className="h-[24px] w-[24px] dark:text-gray-300 lg:hidden"
           onClick={toggleNav}
+          aria-label="Toggle sidebar navigation"
         >
           <AiOutlineClose size={24} id="hamburger" />
         </button>

diff --git a/components/ThemeToggler/themeToggler.tsx b/components/ThemeToggler/themeToggler.tsx
@@ -27,11 +27,18 @@ export function ThemeToggler() {
     <button
       onClick={handleThemeToggle}
       title={`Toggle dark mode (current state: ${resolvedTheme})`}
+      aria-label="Toggle dark mode"
     >
       {resolvedTheme === 'dark' ? (
-        <HiSun {...iconProps} className='text-light-primary hover:text-theme-primary transition duration-300 ease-in-out' />
+        <HiSun
+          {...iconProps}
+          className="text-light-primary hover:text-theme-primary transition duration-300 ease-in-out"
+        />
       ) : (
-        <HiMoon {...iconProps} className='text-text-secondary hover:text-theme-primary transition duration-300 ease-in-out' />
+        <HiMoon
+          {...iconProps}
+          className="text-text-secondary hover:text-theme-primary transition duration-300 ease-in-out"
+        />
       )}
     </button>
   )

diff --git a/pages/contributors.tsx b/pages/contributors.tsx
@@ -136,12 +136,14 @@ const ContributorsPage: FC<{ contributors: Contributor[] }> = ({
               <Link
                 href={`https://github.com/${contributor.login}`}
                 {...linkProps}
+                aria-label={`GitHub Profile of ${contributor.login}`}
               >
                 GitHub
               </Link>
               <Link
                 href={`https://github.com/rupali-codes/LinksHub/commits?author=${contributor.login}`}
                 {...linkProps}
+                aria-label={`Commit History of ${contributor.login} in LinksHub`}
               >
                 Contributions
               </Link>

diff --git a/pages/index.tsx b/pages/index.tsx
@@ -22,7 +22,10 @@ export default function Home() {
         />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <meta name="theme-color" content="#202c46" />
-        <meta name="keywords" content="LinksHub, developers, free resources, tools, software, libraries, frameworks, applications, websites" />
+        <meta
+          name="keywords"
+          content="LinksHub, developers, free resources, tools, software, libraries, frameworks, applications, websites"
+        />
         <meta name="author" content="Rupali Haldiya" />
         <meta name="robots" content="index, follow" />
         <meta name="revisit-after" content="7 days" />