Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

feat: implement orama search for active members and staff members #799

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

josuembuyu
Copy link

@josuembuyu josuembuyu commented Dec 30, 2023

Implemented Orama search functionality for the Active Members and Staff pages.

Fixes: #779

Summary by CodeRabbit

  • New Features

    • Integrated context and asynchronous search functionality into the ActiveMembers component.
    • Updated the Staff component to use context and asynchronous searches.
    • Introduced OramaProvider for centralized database management and search capabilities.
  • Enhancements

    • Improved user display rendering logic in the ActiveMembers component.
    • Standardized data structure for active members' social media links and contributions.
  • Documentation

    • Added schemas for active and staff members to better define data structures.
  • Refactor

    • Reorganized JSX structure within the App component for better readability.
    • Wrapped Layout components with OramaProvider in active members and staff pages for context provision.
  • Style

    • Updated .gitignore in the .husky directory to ignore all contents.

Copy link

vercel bot commented Dec 30, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
4c-site ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 31, 2023 8:25pm

Copy link

coderabbitai bot commented Dec 30, 2023

Walkthrough

The update integrates Orama search into the Active Members and Staff components of the website, enhancing search functionality with features like suggestions and sorting. The search now asynchronously interacts with the newly implemented Orama context, improving the user experience by delivering more relevant results.

Changes

File Path Change Summary
.husky/_/.gitignore Updated to ignore all files within its directory (*).
src/components/ActiveMembers.js Utilizes context and asynchronous search functionality.
src/components/Staff.js Added context hook, useContext, and modified search logic.
src/context/OramaProvider.js Introduced OramaProvider for database management with Orama.
src/context/schemas/activemembersSchema.js Introduced schema for representing active members.
src/context/schemas/staffmembersSchema.js Introduced schema for defining the structure of staff members.
src/data/activemembers.js Modified twitter and contributions fields in data entries.
src/pages/_app.js Reformatting of JSX structure within App component.
src/pages/active-members.js, src/pages/staff.js Wrapped Layout in OramaProvider with respective schemas.

Assessment against linked issues

Objective Addressed Explanation
[#779]: Implement Orama Search for website search functionality
[#779]: Ensure search includes suggestions and sorting
[#779]: Replace JS filter algorithm with Orama search on specific pages

Poem

In the warren, deep and wide,
A clever rabbit worked inside.
With Orama's magic, search refined,
Now finding staff and peers, entwined. 🐇✨

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share

Tips

Chat with CodeRabbit Bot (@coderabbitai)

  • You can directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>.
    • Generate unit-tests for this file.
  • You can tag CodeRabbit on specific lines of code or entire files in the PR by tagging @coderabbitai in a comment. Examples:
    • @coderabbitai generate unit tests for this file.
    • @coderabbitai modularize this function.
  • You can tag @coderabbitai in a PR comment and ask questions about the PR and the codebase. Examples:
    • @coderabbitai generate interesting stats about this repository from git and render them as a table.
    • @coderabbitai show all the console.log statements in this repository.
    • @coderabbitai read src/utils.ts and generate unit tests.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid.
    • @coderabbitai read the files in the src/scheduler package and generate README in the markdown format.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks.

CodeRabbit Commands (invoked as PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger a review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • The JSON schema for the configuration file is available here.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/coderabbit-overrides.v2.json

CodeRabbit Discord Community

Join our Discord Community to get help, request features, and share feedback.

Copy link
Contributor

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great job, josuembuyu! 🎉 Thank you for submitting your first pull request to 4C. Your contribution is valuable and we appreciate your efforts to improve our project. We'll review your changes and provide feedback as soon as possible. Keep up the great work!

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Review Status

Actionable comments generated: 0

Configuration used: CodeRabbit UI

Commits Files that changed from the base of the PR and between 4fcfeac and 6dfe23f.
Files ignored due to filter (2)
  • package.json
  • yarn.lock
Files selected for processing (10)
  • .husky/_/.gitignore (1 hunks)
  • src/components/ActiveMembers.js (2 hunks)
  • src/components/Staff.js (1 hunks)
  • src/context/OramaProvider.js (1 hunks)
  • src/context/schemas/activemembersSchema.js (1 hunks)
  • src/context/schemas/staffmembersSchema.js (1 hunks)
  • src/data/activemembers.js (4 hunks)
  • src/pages/_app.js (1 hunks)
  • src/pages/active-members.js (1 hunks)
  • src/pages/staff.js (1 hunks)
Files skipped from review due to trivial changes (2)
  • .husky/_/.gitignore
  • src/pages/_app.js
Additional comments: 11
src/context/schemas/activemembersSchema.js (1)
  • 1-17: The schema definition for active members appears to be consistent and correct. It defines the expected data types for each field, which should help ensure data integrity when interacting with the Orama search library.
src/context/schemas/staffmembersSchema.js (1)
  • 1-18: The schema definition for staff members is consistent and correct, similar to the active members schema. It defines the data types for each field, which is important for maintaining data integrity with the Orama search library.
src/pages/staff.js (1)
  • 1-15: The integration of OramaProvider in the Home component is done correctly. The staffmembersSchema and staff data are passed as props to OramaProvider, which is necessary for initializing the search context.
src/pages/active-members.js (1)
  • 1-15: The OramaProvider is correctly implemented in the Home component for the active members page, with activemembersSchema and activeMembers data passed as props. This ensures that the search context is initialized with the correct schema and data.
src/context/OramaProvider.js (1)
  • 1-51: The OramaProvider component is well-implemented. It uses React hooks effectively to manage the search database state and provides a search function through context. The use of useEffect to initialize the database and useCallback for the search function are appropriate for performance optimization.
src/components/Staff.js (1)
  • 1-40: The Staff component correctly uses the OramaContext to access the searchDatabase function. The asynchronous searchHandler is implemented properly to handle search operations and update the state with the results.
src/components/ActiveMembers.js (1)
  • 1-38: The ActiveMembers component is updated to use the OramaContext for search functionality. The asynchronous searchHandler function is correctly implemented to interact with the search context and update the component's state based on the results.
src/data/activemembers.js (4)
  • 154-160: Normalizing the twitter field to an empty string when no value is present is a good practice for consistency, especially for search operations that may rely on string data types.

  • 198-201: Changing the contributions field from null to 0 is a correct approach to ensure numerical data consistency across the dataset.

  • 207-210: Standardizing the contributions field to 0 instead of null is a good practice for maintaining data integrity and ensuring that numerical operations on this field do not encounter type-related errors.

  • 225-228: The normalization of the contributions field to 0 is consistent with the rest of the dataset and helps maintain a uniform data type for this field.

Copy link

@kkrishguptaa kkrishguptaa left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tried debugging your issue, it is actually quite simple, you forgot to format the files

Please go ahead and run 'npm run lint --fix' to fix the issues!

Terminal of how I fixed your issue for reference:

@xkrishguptaa ➜ /workspaces/4c-site (feat-implement-orama-search-779) $ yarn run build
yarn run v1.22.19
$ next build

Failed to compile.

./src/context/OramaProvider.js
10:23  Warning: Unexpected space before function parentheses.  space-before-function-paren
13:9  Error: Extra semicolon.  semi
15:22  Error: Extra semicolon.  semi
17:50  Error: Extra semicolon.  semi
18:6  Error: Extra semicolon.  semi

info  - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
@xkrishguptaa ➜ /workspaces/4c-site (feat-implement-orama-search-779) $ yarn lint --fix
yarn run v1.22.19
$ eslint "src/**/**/*.{js,json,jsx,ts,tsx}" --fix
Done in 4.95s.
@xkrishguptaa ➜ /workspaces/4c-site (feat-implement-orama-search-779) $ yarn run build
yarn run v1.22.19
$ next build
 ✓ Linting and checking validity of types    

  ⚡ Million.js 2.6.4
  - Tip:     enable { mute: true } to disable info logs
  - Hotline: https://million.dev/hotline

 ⚡ <Footer> now renders ~55% faster
 ⚡ <Loading> now renders ~100% faster

warn - As of Tailwind CSS v3.3, the `@tailwindcss/line-clamp` plugin is now included by default.
warn - Remove it from the `plugins` array in your configuration to eliminate this warning.
 ✓ Creating an optimized production build    
 ✓ Compiled successfully
 ✓ Collecting page data    
 ✓ Generating static pages (7/7) 
 ✓ Collecting build traces    
 ✓ Finalizing page optimization    

Route (pages)                              Size     First Load JS
┌ ○ /                                      6.95 kB         135 kB
├   └ css/431944509084d071.css             2.19 kB
├   /_app                                  0 B            86.8 kB
├ ○ /404                                   181 B            87 kB
├ ○ /active-members (475 ms)               4.75 kB         158 kB
├ ○ /joinourteam                           52.5 kB         180 kB
├ ○ /projects                              14 kB           142 kB
└ ○ /staff                                 1.43 kB         155 kB
+ First Load JS shared by all              94.6 kB
  ├ chunks/framework-0c7baedefba6b077.js   45.4 kB
  ├ chunks/main-5de5daa30cb39434.js        32.9 kB
  ├ chunks/pages/_app-3e02cfbcc910abe6.js  7.7 kB
  ├ chunks/webpack-32f7cd90361c570e.js     879 B
  └ css/931727bcc480884b.css               7.77 kB

- (Static)  automatically rendered as static HTML (uses no initial props)

Done in 49.17s.
@xkrishguptaa ➜ /workspaces/4c-site (feat-implement-orama-search-779) $

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Review Status

Actionable comments generated: 0

Configuration used: CodeRabbit UI

Commits Files that changed from the base of the PR and between 6dfe23f and 8900efe.
Files ignored due to filter (2)
  • package.json
  • yarn.lock
Files selected for processing (1)
  • src/context/OramaProvider.js (1 hunks)
Files skipped from review as they are similar to previous changes (1)
  • src/context/OramaProvider.js

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Feat]: Implement Orama Search For The Search On The Website
2 participants