Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

#23

Description

Avoid Manipulating DOM Directly: Instead of creating and appending a temporary text area to the DOM for copying to the clipboard, we can use the Clipboard API, which is cleaner and more modern.

Basic Example

Previous Code:-

  const handleCopyToClipboard = (textToCopy) => {
    if (!error) {
      const tempTextArea = document.createElement("textarea");
      tempTextArea.value = textToCopy;
      document.body.appendChild(tempTextArea);
      tempTextArea.select();
      document.execCommand("copy");
      document.body.removeChild(tempTextArea);

      // Update the copy button state
      setIsCopied(true);
    } else {
      // Display the error (you can adjust the UI as needed)
      setIsCopied(false);
      alert(`Error: ${error}`);
    }
  };

Updated Code (More Optimized)

  const handleCopyToClipboard = (textToCopy) => {
    if (!error) {
      navigator.clipboard
        .writeText(textToCopy)
        .then(() => {
          // Update the copy button state
          setIsCopied(true);
        })
        .catch((err) => {
          // Handle clipboard write error
          console.error("Copy to clipboard failed:", err);
          setIsCopied(false);
        });
    } else {
      // Display the error (you can adjust the UI as needed)
      setIsCopied(false);
      alert(`Error: ${error}`);
    }
  };

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT or similar LLMs available to ask the following question.
"Types of Linters in programming"
and follow up questions like:
"How do style linters work?"

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section. You'll directly get points rewarded for this task for adding correct answer as comment

Example on how to write outcome

Initial Prompt:

• "Describe what linting is and why it's important in software development."

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for Accessibility Audits"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for Accessibility Audits"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Description

The pull request template which is supposed to be visible during PR Request is not visible. Collaborators have to write all the basic contents of the PR again and again. Also, each and every PR's structure differs as each collaborator writes heading (or every content) with either h3 or h4 and so on.

Steps To Reproduce

No response

Screenshots

No response

What browsers are you seeing the problem on?

No response

OS

Windows

Have you provided all details?

• Yes, I have provided as much detail as possible

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT or similar LLMs available to ask the following question.
"Explain the basic functionalities and features of Git and GitHub."
and follow up questions like:
"What are the advantages of using Git over other version control systems?"

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• "Describe what linting is and why it's important in software development."

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for API Integration"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for API Integration"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for HTML Structure"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for HTML Structure"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for Responsive Design"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for Responsive Design"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for Web Performance"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for Web Performance"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "What is Web Security and Encryption in OAuth, JWT, and HTTPS?"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "What is Web Security and Encryption in OAuth, JWT, and HTTPS?"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for Web Accessibility"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for Web Accessibility"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

In the context of this project, I will be enhancing the user interface by incorporating icons onto the "Import File" and "Download File" buttons. This strategic addition aims to improve user experience and visual clarity. By introducing intuitive icons alongside these buttons, users will be able to quickly grasp their respective functionalities, thereby enhancing the overall usability of the application. This effort aligns with the project's goal of creating an efficient and user-friendly JSON Linter tool.

Best Regards,
Abhishek Jani.

Basic Example

Icons like this can be used for Download File purpose.

For import file

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

Objective:

Create a user interface (UI) for a JSON code linter that allows users to paste JSON code and choose between two linting methods: local linting and AI-powered linting.

Steps to Complete:

1. Create a New React Project:

   • Use Create React App or another React boilerplate to set up a new React project.
   • Organize your project by creating appropriate folders for components, styles, etc.

2. Choose a UI Framework (Optional but Recommended):

   • Consider using Shopify Polaris components to maintain a consistent design.

3. Design the Main Editor Component:

   • Create a new React component named Editor.
   • Inside the Editor component, add a text area where users can paste their JSON code.
   • Use appropriate HTML tags and React components for the text area.

4. Add Two Buttons for Linting Options:

   • Create a button named Lint Locally: This button will be used for linting the JSON code offline. (Note: You are only designing the button at this stage; no logic is required.)
   • Create another button named Lint with AI API: This button will be used for linting the JSON code using an AI-powered API endpoint. (Note: Again, no logic is required at this stage.)

5. Style Your Components:

   • Apply styling to the text area and buttons to make them visually appealing.
   • If using Shopify Polaris, refer to their documentation for available components and styling options.

6. Test Your Component:

   • Make sure your component renders correctly.
   • Test the layout by resizing the window to ensure responsiveness.

7. Commit and Push Your Changes:

   • Once you're satisfied with your implementation, commit your changes with a descriptive commit message.
   • Push your changes to your forked repository and submit a pull request for review.

Notes:

• Focus on creating a clean and functional UI.
• Backend logic for linting is not required at this stage.
• Refer to React and Shopify Polaris documentation as needed.
• Feel free to ask for help or clarification if you encounter any difficulties.

Basic Example

Make sure to follow the details correctly, ask if there are any questions. Use LLMs for debuging extensively before submitting.

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for CSS Organization"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for CSS Organization"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

Task Overview:

This feature request involves setting up the backend architecture and implementing the local JSON linting logic. It is designed to be worked on parallelly with the "Set Up React Project and Design Main Editor Component" task and focuses on the core functionality required for linting JSON code.

Goal of This Task:

1. Backend Configuration: Configure and set up the backend using a suitable technology (e.g., Node.js, Express).
2. JSON Linting Logic Implementation: Implement a function that takes a JSON string as input, checks for errors, and if no errors are found, properly indents the code.

Steps to Complete:

1. Choose Backend Technology: Select a suitable backend technology such as Node.js with Express, considering the requirements of the project.
2. Set Up Project: Initialize the backend project, setting up necessary dependencies and configurations.
3. Implement Linting Functionality: Write a function that takes a JSON string, parses it, and checks for errors. If errors are found, return the error information. If no errors are found, format the JSON string with proper indentation.
4. Testing: Create some basic unit tests to verify that the linting functionality works as expected.

Preferred Libraries/Components:

• For linting and formatting JSON, you may consider using libraries like jsonlint or other suitable tools.
• For setting up the server, Express.js with Node.js is recommended, but other technologies can be considered based on project needs.

Please ensure that you are clear about the requirements before starting the task. Consult with the project lead or mentors if you have any questions or need further guidance.

Basic Example

Outcome should be a function that takes in json data as input and returns error if any or format's the json data correctly so it is more readable for humans.

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Description

Issue Details:
The bug report states that the "Heading elements are not in a sequentially-descending order." This means that the arrangement of your HTML headings doesn't follow a logical order in terms of hierarchy. Properly ordered headings should have a hierarchical structure, where each heading level is one step lower than the previous level.
Lighthouse shows this bug and to fix this bug we have to change the h4 tag to h3 tag.

Here the tag h4 must be changed to h3 tag.

Steps To Reproduce

1. Go to Editor.jsx
2. Change the h4 tag to h3 tag for sequential ordering of tags.
3. The Accessibilty of your code will increase now!

Screenshots

What browsers are you seeing the problem on?

Chrome

OS

Windows

Have you provided all details?

• Yes, I have provided as much detail as possible

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Learn the fundamentals of gadget.dev and Shopify Partner by reading documentation, setting up accounts, and implementing an example app.

Point Value

This assignment is worth 300 points. Make sure to understand all tasks well before proceeding. Take your time and pay attention to details to secure full points.

Tasks

Step 1: Reading Documentation

• Gadget.dev Documentation: Read through the documentation to understand the platform's capabilities. Checkout all the tutorials and their youtube channel
• Shopify Partner Documentation: Refer to Shopify’s partner documentation or read their blogs.

Step 2: Account Creation

• Gadget.dev: Create a free account on Gadget.dev.
• Shopify Partner: Sign up for a free Shopify partner account.

Step 3: App Implementation

• Choose one app example from Gadget.dev Shopify tutorials and implement it within your Shopify partner account create a development store if you have to.

Step 4: Video Documentation

• Create a 5-10 minute video explaining:
  1. What you learned from the documentation
  2. Which app example you chose and why
  3. A walkthrough of the implemented app

Reference Materials

No response

Expected Outcome

Expected Outcome

1. Two created accounts (Gadget.dev and Shopify Partner)
2. One functional app as seen on the gadget tutorial
3. A 5-10 minute video explaining your accomplishments

Deadline

Please complete this assignment by 11th september 9AM and submit the outcomes as comments below.

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for User Experience (UX)"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for User Experience (UX)"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

The clear button on the webpage is intended to remove the JSON code from the input box, ensuring a fresh start for the user. However, I noticed that even after clicking the clear button, the JSON code still persists in the cookies of the page.

Clearing the JSON code from cookies is essential to ensure that users are starting with a clean slate. The persistence of JSON code in cookies can result in unintended behavior when users reload the page or return to it after some time.

It would greatly enhance the user experience if the clear button not only clears the input box but also removes the associated cookie. This would provide a seamless and consistent experience for users who want to start linting JSON code from scratch.

Before pressing Clear Button

After pressing Clear Button

Basic Example

After clicking the clear button, the JSON code should not only be removed from the input box but also cleared from the cookies of the page. This will provide users with a seamless experience when starting a new JSON linting session.

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT or similar LLMs available to ask the following question.
"How do GitHub Actions fit into a CI/CD pipeline?"
and follow up questions like:
"How does linting fit into a GitHub Actions CI/CD setup?"

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• "Describe what linting is and why it's important in software development."

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

The hover effect on buttons is causing an unintended blending with the light background. When users hover over a button, the background becomes too light which hampers the overall UI. Also, the spacing between the (Input JSON Code and Output JSON Code) sections and the buttons beneath them should be increased to provide a visually balanced and organized layout.

Here is the sample of the issue,

Basic Example

After adding border to the buttons which creates a clear boundary between the button's background and the surrounding background and adding significant margin between the sections and below buttons. The UI will look like

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT or similar LLMs available to ask the following question.
"Explain what JSON is and why it's important."
and follow up questions like:
"What are common use-cases for JSON?"

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section. You'll directly get points rewarded for this task for adding correct answer as comment

Example on how to write outcome

Initial Prompt:

• "Describe what linting is and why it's important in software development."

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "What is Progressive Web Apps (PWAs) and Service Workers in modern browsers?"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "What is Progressive Web Apps (PWAs) and Service Workers in modern browsers?"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "What is Front-End Development and UI/UX Design"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "What is Front-End Development and UI/UX Design"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

In this issue, I will add a clear button with proper function to clear the code written or pasted in the editor column.

Basic Example

Screenshots preview:

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

#25 Upload JSON File

Description

Currently, the option to load a json file from a local directory is not very visually appealing for a user and has some undesired effects on hover.

Basic Example

It would be useful for the project to make the visual design of this feature more appealing to any user who uses the Linter

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for Web Security"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for Web Security"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

#9 React Project

Description

Description

This feature aims to enhance the user experience by providing an autocompletion behavior for braces {} and quotation marks " inside the textarea.

Feature Details

• Autocompletion of Braces: When a user types an opening curly brace { at the end of the text in the textarea, the system will automatically insert a closing curly brace }. Similarly, typing an opening quotation mark " at the end of the text will insert a closing quotation mark ". This will help users write JSON and other text-based content more efficiently.

• Cursor Positioning: The system will intelligently position the cursor in between the inserted braces or quotation marks, allowing users to start typing immediately within the pair.

Benefits

• Streamlines the process of writing JSON code and other text content that requires braces or quotation marks.
• Improves code consistency and reduces potential syntax errors by ensuring balanced pairs of braces and quotation marks.

Basic Example

We can try to add more Autocompletion features in the textarea field.

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT or similar LLMs available to ask the following question.
"Describe what Markdown is and its uses."
and follow up questions like:
"How does Markdown differ from HTML?"

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section. You'll directly get points rewarded for this task for adding correct answer as comment

Example on how to write outcome

Initial Prompt:

• "Describe what linting is and why it's important in software development."

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for JavaScript Code Quality"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for JavaScript Code Quality"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

Adding new Feature

Description

Download Output JSON Feature Enhancement

As part of our ongoing efforts to improve the Linter project's functionality and user experience, we are excited to introduce a new enhancement: the Download Output JSON feature.

Currently, the Linter project offers users the ability to input and lint JSON code through a user-friendly text editor. However, once the JSON code is linted and displayed in the output field, users might want to conveniently save this linted output for their projects. This is where the Download Output JSON feature comes into play.

Stay tuned for updates as I work on implementing this feature to further enrich the capabilities of Linter.

Best regards,
Abhishek Jani

Basic Example

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT or similar LLMs available to ask the following question.
"Explain what custom linting rules are and why they might be necessary."
and follow up questions like:
"What are some use-cases for custom linting rules?"

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• "Describe what linting is and why it's important in software development."

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for DevOps"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for DevOps"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for Collaboration and Teamwork"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for Collaboration and Teamwork"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

Enhancing Cursor Position within Double Quotes (" ") When Adding a New Pair of Curly Braces in Code

Currently, the linter provides users with JSON snippets, but when users input curly braces ( { ) inside the editor , the cursor moves outside the intended context, diminishing the user experience. This requires users to manually place the cursor inside the double quotes (" ") to input JSON code.

Enhancing the behavior to position the cursor inside double quotes (" ") when a user enters an opening curly brace ({) is a user experience enhancement that streamlines JSON code entry.

This modification ensures a more intuitive and efficient user experience, reducing the need for manual cursor adjustments and facilitating smooth JSON code input.

I will look forward to solve this issue.
Best regards,
Zaid Khan

Basic Example

Current linter code editor works: -

Code Editor must be:-

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

I have identified an opportunity to enhance the user experience by refining the behavior of disabled buttons and optimizing the user interface's responsiveness, particularly for mobile devices. Currently, disabled buttons retain a hover effect that may mislead users into thinking they are interactive. To address this, I aim to eliminate hover effects for disabled buttons, ensuring a more intuitive and consistent interface.

Furthermore, I recognize that the current button sizing may not be optimized for mobile devices, potentially causing inconvenience to users. As part of this effort, I intend to work on improving the UI's responsiveness to varying screen sizes, ensuring that buttons and other elements are appropriately sized and arranged for optimal usability across devices.

Basic Example

This is how the Download button should look when there is no Output Code.

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

Addition of a "Copy to Clipboard" button within the JSON editor of the JSON Code Linter application.

Basic Example

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "Best Practices for Version Control"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "Best Practices for Version Control"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

Currently, ESLint is giving a warning related to missing prop validation for the 'jsonCode' prop in the Editor component. This issue aims to address and resolve the warning by adding proper prop validation using PropTypes.

Basic Example

Before Resolving Issue:-

After Resolving Issue:-

Updated Code:-

Editor.propTypes = {
  jsonCode: PropTypes.string.isRequired,
  onJsonChange: PropTypes.func.isRequired,
  updatedJson: PropTypes.string,
  error: PropTypes.string,
  clearJsonCode: PropTypes.func.isRequired,
  setJsonCode: PropTypes.func.isRequired,
};

function Editor({
  jsonCode,
  onJsonChange,
  updatedJson,
  error,
  clearJsonCode,
  setJsonCode,
}) {
 // Remaining code continued

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

There is not need to specify the specific package name while installing, instead we can simply use npm install to install all the dependencies for our project.
Also, to run our project, we can specify the npm commands to run project's frontend and backend concurrently or to run them individually based on the users choice.

This will make it easier for beginners to setup and run our project.

Basic Example

Here is the basic sample:

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

New Feature Issue

Description

Feature Request: File Upload Button

Description:

As the project's functionality evolves, we recognize the need for enhanced user convenience and flexibility. The proposed feature entails the integration of a File Upload Button within the project's user interface, allowing users to seamlessly upload .json files directly into the text editor.

Benefits:

1. Efficient Data Input: Users can bypass manual entry by uploading pre-existing .json files, streamlining the data input process.

2. User-Friendly Experience: The File Upload Button enhances user experience, catering to various data input preferences.

3. Time Savings: Users can quickly incorporate existing .json data, saving valuable time during data preparation.

Implementation Plan:

• The button will trigger a file selection dialog for users to choose the desired .json file.
• The selected file's content will be seamlessly injected into the text editor, providing instant accessibility.

We believe that this feature aligns with the project's goals of improved usability and efficiency. Your feedback and suggestions are highly valued as we work to continually enhance the project's capabilities.

Thank you for your support and involvement in advancing the project.

Kind regards,
Abhishek Jani

Basic Example

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

In an effort to maintain high-quality code and follow the best coding practices in our project, I suggest adding two new checkboxes to our pull request template:

AI Code Review:
This will encourage contributors to make use of AI tools for initial code suggestions and checks, which can help identify potential issues and improvements before the code reaches human reviewers.

Coding Standards:
This will remind contributors to adhere to the current best practices and coding standards for our project's tech stack, which can improve readability, maintainability, and overall code quality.

Basic Example

AI Code Review: "I have checked my code with free AI tools like ChatGPT for suggestions."

Coding Standards: "I have ensured that my code follows the latest coding standards for our chosen language/platform."

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

As a user of the JSON Linter web application, I find it useful to have a visual indicator of the character count for the JSON code I'm inputting. This feature would be particularly beneficial for users who need to work within certain size limits or constraints. Currently, the application lacks a character count display, which makes it somewhat challenging to keep track of the length of the JSON code.

This feature request aims to provide users with valuable insights into the length of their JSON code before and after the formatting process. By displaying character counts for both input and output JSON, users can better manage and optimize their code size, especially when working within size constraints or when communicating with systems that have specific JSON size requirements.

Basic Example

Here is the basic sample for the feature,

By offering character counts for both input and output JSON, the JSON Linter can further empower its users to create well-structured and appropriately sized JSON code.

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Description

When utilizing the Upload JSON File feature, a couple of issues are observed. After selecting a JSON file for upload, the file name is correctly displayed beside the Upload JSON File button. However, if the Clear button is then pressed to clear the JSON input, the code gets removed as expected but the file name continues to persist beside the Upload JSON File button. Furthermore, attempting to re-upload the same file fails. This issue seems to arise due to the retained value of the file input element after clearing the JSON input.

When I upload text.json

After pressing the clear button (file name still persists)

Steps To Reproduce

1. Upload a JSON file by clicking the "Upload JSON File" button and selecting a file.
2. Notice the uploaded file name displayed beside the "Upload JSON File" button.
3. Press the "Clear" button to clear the JSON input.
4. Observe that the JSON input is correctly cleared, but the file name still remains beside the "Upload JSON File" button.
5. Attempt to upload the same file again.
6. Notice that the file does not get uploaded, possibly due to the input element retaining the previous file's value.

Screenshots

No response

What browsers are you seeing the problem on?

Chrome

OS

Windows

Have you provided all details?

• Yes, I have provided as much detail as possible

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

#9 React UI

Description

This feature aims to enhance user experience by storing the text input provided by the user in the text field within the Editor Component, in browser cookies and adding a logic to display the stored cookie data in the text field on page reloads.

Feature Details:

• Store Text Input in cookie or update cookie whenever TextField is updated.
• Load stored JSON code from cookie on page reload.

Benefits:

• Simplicity: Users of the library can benefit from a straightforward and integrated solution for data storage without the need for external APIs or additional dependencies.
• Reduced Dependencies: By offering native cookie storing logic, the project can potentially reduce the number of dependencies required by the application.
• Flexibility: Developers can choose to utilize the built-in cookie storage or opt for alternative storage mechanisms, depending on their specific use cases.

Basic Example

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

As I have visited the repository, there is not a devoted contributing.md file. So in this I wanted to create a contributing md file with proper screenshots added and with proper steps added.
Like what are the steps needed to add the linter project directly from the Github and setup the project locally.

Basic Example

example-
https://github.com/priyankarpal/ProjectsHut/blob/main/contributing.md

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

I've noticed that in the LinterButtons and Editor component, there is missing PropTypes validation for the onFormatJSON prop and jsonCode, onJsonChange, updatedJson, error props, which could lead to potential runtime errors or unexpected behavior. PropTypes validation is an essential feature in React that helps ensure the correct types and shapes of props are passed to components, improving code reliability and maintainability.

Basic Example

Steps to Reproduce:
Open the LinterButtons component in the codebase.
Observe that the onFormatJSON prop is used without proper PropTypes validation.

Expected Behavior:
PropTypes validation should be added to the LinterButtons component to specify that the onFormatJSON prop is required and should be a function.

Example Fix:

import React from "react";
import PropTypes from "prop-types";

function UserProfile({ username, age, email }) {
  return (
    <div>
      <h2>User Profile</h2>
      <p>Username: {username}</p>
      <p>Age: {age}</p>
      <p>Email: {email}</p>
    </div>
  );
}

// This is most important for the validation check.
UserProfile.propTypes = {
  username: PropTypes.string.isRequired,
  age: PropTypes.number.isRequired,
  email: PropTypes.string.isRequired,
};

export default UserProfile;

By adding PropTypes validation for the onFormatJSON prop, the codebase will be more resilient to potential errors and will help maintain a higher quality standard. I suggest addressing this issue to ensure proper PropTypes validation for critical component props.

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT3.5 or chatGPT4 to ask the following question.

If using chatGPT3.5:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, always include examples or scenarios to clarify your points and for better understanding. Keep a common objective in mind while answering.

Topic "What is Back-End Development and API Development"

If using chatGPT4:

You are ChatGPT, and your role is to engage in a recursive, endless discussion with me on a topic we decide upon. If the conversation drifts away from the topic, I will use the command 'Align conversation' to bring it back on track. At the end of each conversation, provide a short analysis summarizing how the discussion relates to the topic at hand. Whenever you explain something, include examples to clarify your points. The ultimate goal is to create a knowledge base from our discussion that can be easily transferred to another person, allowing them to build upon it and add their own inputs. For every answer containing information that I've asked for, provide the data in a structured JSON format in key-value pairs like {"question": "answer"}, {"question": "answer"} that can be easily copied into a JSON file. Keep a common objective in mind while answering.

Topic "What is Back-End Development and API Development"

Follow up on this topic with atleast 10 more such questions

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• [given above]

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details

Is there an existing issue for this?

• I have searched the existing issues

Reference Issues

No response

Description

Improve user experience with concise labels on buttons, fields, and uploads. This feature enhances accessibility, enabling users with disabilities to navigate your app effortlessly.

Basic Example

In this code, I've added role="group" to the ButtonGroup to indicate that it's a group of buttons. I've also added the aria-label attribute to the ButtonGroup to provide a label for the group. Additionally, I've used the accessibilityLabel prop for each button to provide an accessible label for screen readers. Finally, I've kept the semantic elements for the buttons themselves.

In this code, I've added aria-label attributes to the TextField components and the input element for the file upload, as well as to the read-only TextField for output. These accessibility labels help provide context and meaning to these elements for users who rely on screen readers.

Have you given as much information as possible about the feature?

• Yes, I have provided as much as information for the feature

Is there an existing Discovery issue on this topic?

• I have searched the existing issues

Objective

Use chatGPT or similar LLMs available to ask the following question.
"Discuss the challenges and benefits of introducing linting into a legacy codebase."
and follow up questions like:
"What steps should be taken before linting legacy code?"

Reference Materials

No response

Expected Outcome

List down only the key insights gained from multiple rounds of questioning.
List all the questions/prompts used below in the comment section

Example on how to write outcome

Initial Prompt:

• "Describe what linting is and why it's important in software development."

Recursive Prompts:

1. "How do linters work under the hood?"
2. "What types of problems can linters catch?"
3. "Explain the impact of linting on code quality."
4. "How can linting be integrated into a continuous integration (CI) system?"
   .
   .
   .

Outcome:

Key Insights gained:

• Linting is the process of checking source code for programmatic and stylistic errors.
• Linters use static analysis to identify issues without running the code.
• They can catch syntax errors, potential bugs, or even style guide violations.
• Linting contributes to better code readability and maintainability.
• It can be automated and integrated into CI pipelines for consistent code quality.
  .
  .
  .

Have you provided comprehensive details for this discovery task?

• Yes, I have provided comprehensive details