c-code-x / codex-website

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

codex-website's Issues

Update Contribution Guidelines and Templates

Issue Description

Problem

The current issue templates in the repository are outdated and insufficient, causing confusion among contributors and hindering the smooth process of opening and resolving issues. The lack of detailed instructions and examples is impeding the quality of issue reports, making it difficult for contributors to provide necessary information.

Proposed Solution

We need to update the contribution guidelines and issue templates to establish a standardized approach for contributors. The guidelines should cover essential aspects such as PR format, code quality standards, commit message conventions, and general issue reporting guidelines.

Changes to be Documented

1. Contribution Guidelines:

   • Clarify the process for submitting issues and pull requests.
   • Specify the expected format for pull requests.
   • Define code formatting and quality standards.
   • Outline commit message format and conventions.

2. Issue Templates:

   • Provide detailed instructions for opening bug fixes, feature requests, and other types of issues.
   • Include examples of well-structured issue reports.
   • Address common questions and concerns in the templates.

Expected Benefits

1. Standardization:

   • Ensure that all contributors follow the same set of guidelines.
   • Facilitate a uniform and streamlined contribution process.

2. Clarity:

   • Reduce confusion by providing clear and comprehensive instructions.
   • Enhance the quality of issue reports and pull requests.

3. Efficiency:

   • Expedite issue resolution by improving the information provided in issue reports.
   • Streamline the review and merging process for pull requests.

Action Items

1. Collaborate on defining and documenting contribution guidelines.
2. Revise and enhance the existing issue templates.
3. Include examples and illustrations to aid contributors in understanding the guidelines.
4. Review and approve the updated guidelines and templates.

Assignees: @SaiSantoshPradyumna @breathecode6365

Labels: Documentation, Enhancement, Help Wanted

Ambiguous homepage or landing page

Ambiguous homepage or landing page

Currently, we have two different pages with the same content. That is the landing page and the root index page.
Those two pages are

1. pages/index.tsx
2. pages/LandingPage.tsx

When a user visits our webpage, they are served pages/index.tsx as the home page, but when they go to an under construction page and try to navigate via the button "go back", they are redirected to pages/LandingPage.tsx as the homepage in which the title of the page is also broken and not updated.

Possible solution

I think pages/index.tsx is supposed to be the home page and pages/LandingPage.tsx is just a refactored component which contains the content of the home page. A possible solution would be to refactor the pages/LandingPage.tsx to components/LandingPage.tsx this way we can treat it as a component rather than a page.

Also we need to change the hyperlink <Link href={"/"}><button>Go Back</button></Link>

Lack of contribution guidelines

Lack of contribution guidelines

Clear and concise contribution guidelines should be made so that the contributors are comfortable understanding our organization's goals and guidelines
Please create these documents or markdowns to solve this issue

• Contribution guidelines
• issue template
• pull request template

Please refer these as an example CONTRIBUTING.md ISSUE.md PR.md

Unresolved Bugs

Here are the issues with the website followed by their detailed description.

1. LinkedIn profiles are not visible.

On the Members page, the LinkedIn icons do not show the LinkedIn handles for core members Punith, Bharath, Tamanna, Suhith, Surya, and Pradyumana.

2. Broken LinkedIn profile links

When clicked, the LinkedIn icon displays a broken link. The LinkedIn profiles of members Vishal and Sanjana are inaccessible

Here's the attachement: https://www.linkedin.com/in/vishal-sharma-67321b1a4

3. Incorrectly displayed GitHub handle

The GitHub icon redirects to the LinkedIn profile instead of the GitHub profile. This issue affects Tamanna's profile.

4. GitHub handles are not displayed.

On the Members page,the GitHub icon does not display the GitHub handles of members, Bharath, Surya and Pradyumana.

5. Instagram handles not displayed

The Instagram icon fails to display the Instagram handles for members Tushar and Surya.

6. Broken Instagram profile link

Upon interaction, the Instagram icon displays Instagram page link that is broken. Unable to view Instagram handle of member Hilux.

Here's the attachement: https://www.instagram.com/fokouhilux/

7. Incorrectly displayed Instagram handle

On the Members page, the Instagram icon does not direct to their Instagram profile but instead to their GitHub profile. Wrong profile shown for Pradyumana.

8. Inconsistent follower count

On the About Us page, the follower counts for YouTube, Instagram, and Discord do not accurately reflect the actual number of followers. The website shows 600 followers on Instagram, 550 on Discord, and 50 on YouTube. But, the real counts are 1001 , 535, and 63 followers respectively.

Here's the attachment of the page: https://beta-codex-gitam.vercel.app/aboutus

9. Dysfunctional link for resources

Under the webpage, the link provided for the competitive programming resources does not work under quick links and services. It instead shows that the page is under construction while other resources links work.

https://beta-codex-gitam.vercel.app/underconstruction

10. Outdated Team roles

The members list on the members page shows a list of roles against their names that do not match current people and their roles in the club.

https://beta-codex-gitam.vercel.app/members

Feature Request: Tailored Problem Practice Sheet from Codeforces

Issue Description

Context:

As fellow members of CodeX, I'm excited to share an idea for our Competitive Programming (CP) group. Picture this: a feature that empowers each one of us to effortlessly create a personalized problem practice sheet directly from Codeforces, focusing on a specific rating range.

Here's why this feature would be a game-changer for our CP group:

1. Targeted Skill Improvement:

   • Ever felt the need to hone your skills in a particular rating range? With this feature, you can tailor your practice to match your current level and challenge yourself to the next one.

2. Latest Contest Insights:

   • Stay ahead of the game by accessing problems from the most recent contests. The feature will intelligently order problems so that you can grasp the latest patterns and strategies employed in the recent contests.

3. Efficient Problem Management:

   • No more sifting through irrelevant problems. Easily distinguish between problems you've solved, attempted, or haven't touched. It's a streamlined approach to managing your problem-solving journey.

4. Customizable Tag Visibility:

   • Make the practice environment truly your own. Choose to see or hide problem tags based on your preferences. Whether you want a minimalist interface or a detailed breakdown, it's all in your hands.

Imagine the convenience and efficiency this feature would bring to our CP group members. It's not just a tool; it's a catalyst for our individual growth as competitive programmers.

Let's consider integrating this feature into our website, leveraging the power of the Codeforces public API to take our CP experience to the next level. Your thoughts and feedback on this idea are crucial, so let's discuss and shape the future of our CP group together!

Issue Details

Feature Requirements:

1. Fetch Problems by Rating Range:

   • Users should be able to fetch all problems from recent contests within a given rating range (e.g., 1100 to 1200).
   • The fetched problems should be ordered based on the most recent contests, providing insight into the latest contest patterns.

2. Distinguish Problem Status:

   • Users should have the ability to distinguish between problems they have solved, attempted, and so on.
   • This feature enhances the user experience by providing a clear overview of their progress.

3. Toggle Problem Tags Visibility:

   • Users should be able to control the visibility of problem tags.
     • Hide Tags: Hide all problem tags.
     • Show Only for Solved: Display tags only for problems that the user has solved.
     • Show for Everything: Display tags for all problems.

Implementation Details:

• Utilize the Codeforces public API to fetch problem details and contest details. (Reference: Codeforces API)

Additional Notes:

• This feature aims to provide a more personalized and efficient practice experience for users in the CP group.

How to Replicate:

N/A

Priority:

High

Labels:

• enhancement
• Codeforces API
• Competitive Programming
• Web Development

Switch to SVG for Logo Images in Footer

I noticed that the logos for Discord, GitHub, Instagram, and YouTube in the footer are currently using PNG format. I propose that we switch these images to SVG format for the following reasons:

• Scalability: SVGs are vector-based and can scale to any size without losing quality, making them ideal for responsive design.
• File Size: SVGs often have smaller file sizes compared to PNGs, especially for simple designs like logos. This can improve page load times and overall performance.
• Editability: SVGs can be easily edited and styled with CSS, providing more flexibility for design changes in the future.
• Accessibility: SVGs can be made accessible to screen readers, improving the website’s overall accessibility.

cf-problem-sheet Backend API

This issue is part of the feature #74

here's a simple design for the API call:

API Endpoint:

GET http://localhost:3000/api/cf-problem-sheet

Query Parameters:

• handle (required): Codeforces handle of the user.
• minProblemRating (optional): Minimum problem rating.
• maxProblemRating (optional): Maximum problem rating.
• numberOfPreviousContests (optional): Number of previous contests to consider.

Example Request:

GET http://localhost:3000/api/cf-problem-sheet?handle=harsha9554&minProblemRating=0&maxProblemRating=1400&numberOfPreviousContests=5

Example Response:

{
    "meta": {
        "handle": "harsha9554",
        "minProblemRating": 0,
        "maxProblemRating": 1400,
        "numberOfPreviousContests": 5
    },
    "problems": [
        {
            "contestId": 1903,
            "index": "A",
            "name": "Halloumi Boxes",
            "type": "PROGRAMMING",
            "points": 500,
            "rating": 800,
            "tags": [
                "brute force",
                "greedy",
                "sortings"
            ],
            "verdict": "NONE",
            "URL": "https://codeforces.com/problemset/problem/1903/A"
        },
        {
            "contestId": 1901,
            "index": "A",
            "name": "Line Trip",
            "type": "PROGRAMMING",
            "rating": 800,
            "tags": [
                "greedy",
                "math"
            ],
            "points": 0,
            "verdict": "NONE",
            "URL": "https://codeforces.com/problemset/problem/1901/A"
        },
        {
            "contestId": 1900,
            "index": "A",
            "name": "Cover in Water",
            "type": "PROGRAMMING",
            "points": 500,
            "rating": 800,
            "tags": [
                "constructive algorithms",
                "greedy",
                "implementation",
                "strings"
            ],
            "verdict": "NONE",
            "URL": "https://codeforces.com/problemset/problem/1900/A"
        },
        {
            "contestId": 1900,
            "index": "B",
            "name": "Laura and Operations",
            "type": "PROGRAMMING",
            "points": 1000,
            "rating": 900,
            "tags": [
                "dp",
                "math"
            ],
            "verdict": "NONE",
            "URL": "https://codeforces.com/problemset/problem/1900/B"
        },
        {
            "contestId": 1901,
            "index": "B",
            "name": "Chip and Ribbon",
            "type": "PROGRAMMING",
            "rating": 1100,
            "tags": [
                "greedy",
                "math"
            ],
            "points": 0,
            "verdict": "NONE",
            "URL": "https://codeforces.com/problemset/problem/1901/B"
        },
        {
            "contestId": 1903,
            "index": "B",
            "name": "StORage room",
            "type": "PROGRAMMING",
            "points": 1000,
            "rating": 1200,
            "tags": [
                "bitmasks",
                "brute force",
                "constructive algorithms",
                "greedy"
            ],
            "verdict": "NONE",
            "URL": "https://codeforces.com/problemset/problem/1903/B"
        },
        {
            "contestId": 1900,
            "index": "C",
            "name": "Anji's Binary Tree",
            "type": "PROGRAMMING",
            "points": 1250,
            "rating": 1300,
            "tags": [
                "dfs and similar",
                "dp",
                "trees"
            ],
            "verdict": "NONE",
            "URL": "https://codeforces.com/problemset/problem/1900/C"
        },
        {
            "contestId": 1903,
            "index": "C",
            "name": "Theofanis' Nightmare",
            "type": "PROGRAMMING",
            "points": 1500,
            "rating": 1400,
            "tags": [
                "constructive algorithms",
                "dp",
                "fft",
                "greedy",
                "hashing"
            ],
            "verdict": "NONE",
            "URL": "https://codeforces.com/problemset/problem/1903/C"
        },
        {
            "contestId": 1901,
            "index": "C",
            "name": "Add, Divide and Floor",
            "type": "PROGRAMMING",
            "rating": 1400,
            "tags": [
                "constructive algorithms",
                "greedy",
                "math"
            ],
            "points": 0,
            "verdict": "NONE",
            "URL": "https://codeforces.com/problemset/problem/1901/C"
        }
    ]
}

This design provides a clear structure for the API call, specifying required and optional parameters, along with an example request and response for better understanding. @Jaideep-C

Exposure of Sensitive Information in Repository

I noticed that there are several sensitive keys exposed in your repository, specifically your YouTube channel ID key, API key, and Discord client key. This is a significant security risk, as malicious users could potentially misuse these keys.

Additionally, I observed that your .env file is also exposed with keys, and there is no .env.example file in the repository.

Here are some recommended steps to resolve these issues:

Remove the exposed keys: You should immediately remove the exposed keys from your repository. This includes the YouTube channel ID key, API key, and Discord client key.

Regenerate your keys: After removing the exposed keys, you should regenerate them to ensure that any copies of the old keys are rendered useless.

Use environment variables: Instead of hardcoding your keys into your code, you should use environment variables to store them. This allows you to keep your keys secret and separate from your code.

Add a .env.example file: To make it easier for others to understand what environment variables are needed, you can add a .env.example file to your repository. This file should outline all the necessary environment variables without exposing any actual keys.

Remove the .env file from the repository: Your .env file should not be included in the repository. You can add .env to your .gitignore file to ensure it is not accidentally committed.

Please consider making these changes to improve the security of your project.

Passive functional Caroursel Buttons

Passive functional Caroursel Buttons

Currently, we have carousel at the index.js, where the left and right navigation to carousel is not functioning.
Possible Solutions are

1. remove Carousel navigation buttons
2. else Make buttons functional

Guidelines to Issue Contributor

1. Make your changes, send PR only to alpha branch
2. Follow Contributors.md to achieve the acceptance of PR

Defective Navbar

#Defective Navigation bar
Currently, we have navigation bar component, the issue is, when on small screens like mobile phones, if the page is reloaded, suddenly NAVIGATION bar appears or goes.

##Possibly

1. Change the logic of NAVIGATION BAR
2. Check with the State Functionality of the logic

Guidelines to Issue Contributor

1. Make your changes, send PR only to alpha branch
2. Follow Contributors.md to achieve the acceptance of PR