Merge pull request #15 from ai-buddies/dev-1

Search Bar added

admin/scripts/resizeImage.js

@@ -0,0 +1,79 @@
+import fs from 'fs-extra';
+import path from 'path';
+import {fileURLToPath} from 'url';
+import {program} from 'commander';
+import logger from '@docusaurus/logger';
+import sharp from 'sharp';
+import imageSize from 'image-size';
+
+function maybeParseInt(n) {
+  const res = Number.parseInt(n, 10);
+  if (Number.isNaN(res)) {
+    return undefined;
+  }
+  return res;
+}
+
+const showcasePath = 'src/data/showcase';
+
+program
+  .arguments('[imagePaths...]')
+  .option('-w, --width <width>', 'Image width', maybeParseInt)
+  .option('-h, --height <height>', 'Image height', maybeParseInt)
+  .action(async (imagePaths, options) => {
+    if (imagePaths.length === 0) {
+      imagePaths.push(showcasePath);
+    }
+    const rootDir = fileURLToPath(new URL('../..', import.meta.url));
+    const images = (
+      await Promise.all(
+        imagePaths.map(async (p) =>
+          path.extname(p)
+            ? [path.resolve(rootDir, p)]
+            : (await fs.readdir(p)).map((f) => path.resolve(rootDir, p, f)),
+        ),
+      )
+    )
+      .flat()
+      .filter((p) => ['.png', 'jpg', '.jpeg'].includes(path.extname(p)));
+
+    const stats = {
+      skipped: 0,
+      resized: 0,
+    };
+
+    await Promise.all(
+      images.map(async (imgPath) => {
+        const {width, height} = imageSize(imgPath);
+        const targetWidth =
+          options.width ?? (imgPath.includes(showcasePath) ? 640 : 1000);
+        const targetHeight =
+          options.height ?? (imgPath.includes(showcasePath) ? 320 : undefined);
+        if (
+          width <= targetWidth &&
+          (!targetHeight || height <= targetHeight) &&
+          imgPath.endsWith('.png')
+        ) {
+          // Do not emit if not resized. Important because we can't guarantee
+          // idempotency during resize -> optimization
+          stats.skipped += 1;
+          return;
+        }
+        logger.info`Resized path=${imgPath}: before number=${width}×number=${height}; now number=${targetWidth}×number=${
+          targetHeight ?? Math.floor((height / width) * targetWidth)
+        }`;
+        const data = await sharp(imgPath)
+          .resize(targetWidth, targetHeight, {fit: 'cover', position: 'top'})
+          .png()
+          .toBuffer();
+        await fs.writeFile(imgPath.replace(/jpe?g/, 'png'), data);
+        stats.resized += 1;
+      }),
+    );
+
+    logger.info`Images resizing complete.
+        resized: number=${stats.resized}
+        skipped: number=${stats.skipped}`;
+  });
+
+program.parse(process.argv);

docusaurus.config.ts

@@ -2,8 +2,8 @@ import { themes as prismThemes } from "prism-react-renderer";
 import type { Config } from "@docusaurus/types";
 import type * as Preset from "@docusaurus/preset-classic";
 import tailwindPlugin from "./plugins/tailwind-config.cjs";
-import remarkMath from 'remark-math';
-import rehypeKatex from 'rehype-katex';
+import remarkMath from "remark-math";
+import rehypeKatex from "rehype-katex";
 
 const config: Config = {
   title: "AIBuddies",
@@ -18,8 +18,8 @@ const config: Config = {
 
   // GitHub pages deployment config.
   // If you aren't using GitHub pages, you don't need these.
-  organizationName: "ai-buddies", 
-  projectName: "AIBuddies", // 
+  organizationName: "ai-buddies",
+  projectName: "AIBuddies", //
 
   onBrokenLinks: "throw",
   onBrokenMarkdownLinks: "warn",
@@ -48,7 +48,7 @@ const config: Config = {
           remarkPlugins: [remarkMath],
           rehypePlugins: [rehypeKatex],
           editUrl:
-            "https://github.com/ai-buddies/ai-buddies.github.io/tree/main/",          
+            "https://github.com/ai-buddies/ai-buddies.github.io/tree/main/",
         },
 
         theme: {
@@ -90,16 +90,16 @@ const config: Config = {
   markdown: {
     mermaid: true,
   },
-  
-  themes: ['@docusaurus/theme-mermaid'],
+
+  themes: ["@docusaurus/theme-mermaid"],
 
   stylesheets: [
     {
-      href: 'https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css',
-      type: 'text/css',
+      href: "https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css",
+      type: "text/css",
       integrity:
-        'sha384-odtC+0UGzzFL/6PNoE8rX/SPcQDXBJ+uRepguP4QkPCm2LBxH3FA3y+fKSiJ+AmM',
-      crossorigin: 'anonymous',
+        "sha384-odtC+0UGzzFL/6PNoE8rX/SPcQDXBJ+uRepguP4QkPCm2LBxH3FA3y+fKSiJ+AmM",
+      crossorigin: "anonymous",
     },
   ],
 
@@ -149,13 +149,23 @@ const config: Config = {
           label: "Blog",
           position: "left",
         },
+        {
+          type: "search",
+          position: "right",
+        },
         // {
         //   href: "https://github.com/ai-buddies/ai-buddies.github.io",
         //   label: "GitHub",
         //   position: "right",
         // },
       ],
     },
+    algolia: {
+      apiKey: "325c35f2dc8348505df8084d1ce0be65",
+      indexName: "docsearch",
+      appId: "RGDHSD9WE1",
+      contextualSearch: false,
+    },
     footer: {
       style: "dark",
       links: [
@@ -201,16 +211,16 @@ const config: Config = {
       theme: prismThemes.github,
       darkTheme: prismThemes.dracula,
       additionalLanguages: [
-        'java',
-        'latex',
-        'haskell',
-        'matlab',
-        'PHp',
-        'powershell',
-        'bash',
-        'diff',
-        'json',
-        'scss',
+        "java",
+        "latex",
+        "haskell",
+        "matlab",
+        "PHp",
+        "powershell",
+        "bash",
+        "diff",
+        "json",
+        "scss",
       ],
     },
     docs: {

package.json

@@ -17,9 +17,11 @@
   "dependencies": {
     "@docusaurus/core": "3.5.2",
     "@docusaurus/plugin-ideal-image": "^3.5.2",
+    "@docusaurus/plugin-sitemap": "^3.5.2",
     "@docusaurus/preset-classic": "3.5.2",
     "@docusaurus/theme-live-codeblock": "^3.5.2",
     "@docusaurus/theme-mermaid": "^3.5.2",
+    "@docusaurus/theme-search-algolia": "^3.5.2",
     "@mdx-js/react": "^3.0.0",
     "clsx": "^2.0.0",
     "prism-react-renderer": "^2.3.0",

src/css/custom.css

@@ -127,3 +127,9 @@ a:hover {
 .custom-drop-shadow {
   filter: drop-shadow(0 4px 6px var(--ifm-color-primary));
 }
+
+.gradient-text {
+  background: linear-gradient(120deg, var(--hero-gradient-start), var(--hero-gradient-end));
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+}

src/pages/faq.tsx

@@ -0,0 +1,88 @@
+import React, { useState } from "react";
+import { FaChevronDown, FaChevronUp } from "react-icons/fa";
+import Layout from "@theme/Layout";
+import Header from "../ui/Header";
+
+interface FaqItem {
+  question: string;
+  answer: string;
+}
+
+const faqData: FaqItem[] = [
+  {
+    question: "How do I reset my password?",
+    answer:
+      "To reset your password, click on the 'Forgot Password' link on the login page and follow the instructions sent to your registered email. If you don't receive an email, check your spam folder or contact support.",
+  },
+  {
+    question: "How can I update my account information?",
+    answer:
+      "Go to the 'Account Settings' section in your profile. From there, you can update your personal details, change your email address, and modify other account settings.",
+  },
+  {
+    question: "What is AIBuddies' refund policy?",
+    answer:
+      "We offer a 30-day money-back guarantee for all our courses. If you're not satisfied with your purchase, contact our support team for a full refund within 30 days of your purchase.",
+  },
+  {
+    question: "How do I access the AI projects and resources?",
+    answer:
+      "Once you log in to your account, navigate to the 'Projects' section in the main menu. Here, you'll find a curated list of AI projects and resources that are updated regularly.",
+  },
+  {
+    question: "Can I contribute to AIBuddies?",
+    answer:
+      "Yes, we welcome contributions from the community! You can contribute by suggesting new content, reporting issues, or submitting pull requests on our GitHub repository.",
+  },
+];
+
+const Faq: React.FC = () => {
+  const [openIndex, setOpenIndex] = useState<number | null>(null);
+
+  const toggleFaq = (index: number) => {
+    setOpenIndex(openIndex === index ? null : index);
+  };
+
+  return (
+    <Layout>
+      <div className="bg-gray-100 dark:bg-gray-900 min-h-screen py-12 px-6 md:px-16 lg:px-24">
+        <div className="max-w-7xl mx-auto text-center">
+          <Header title="Frequently Asked Questions" />
+          <p className="text-gray-600 dark:text-gray-400 mb-12">
+            Here are some of the most common questions we receive. Click on a
+            question to view the answer.
+          </p>
+
+          {/* FAQ List */}
+          <div className="space-y-6 text-left">
+            {faqData.map((item, index) => (
+              <div
+                key={index}
+                className="bg-white dark:bg-gray-800 shadow-md rounded-md p-4"
+              >
+                <button
+                  className="w-full flex justify-between items-center text-left focus:outline-none dark:bg-gray-800 border-none rounded p-2"
+                  onClick={() => toggleFaq(index)}
+                >
+                  <h3 className="text-lg font-semibold text-gray-800 dark:text-gray-200">
+                    {item.question}
+                  </h3>
+                  <span className="text-gray-600 dark:text-gray-400">
+                    {openIndex === index ? <FaChevronUp /> : <FaChevronDown />}
+                  </span>
+                </button>
+                {openIndex === index && (
+                  <div className="mt-3 text-gray-600 dark:text-gray-400 px-4">
+                    {item.answer}
+                  </div>
+                )}
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+    </Layout>
+  );
+};
+
+export default Faq;