Add a reset button in settings dialog

[abi]

Now that we have a lot of settings being stored in local storage. We can run into issues when new keys are added for instance. A reset button would be helpful for people to self-fix any bugs.

Checklist

• [X] Modify frontend/src/components/SettingsDialog.tsx ✓ https://github.com/abi/screenshot-to-code/commit/98885299b10913af3c89dd56499edd5cf4c2a26d
• [X] Modify frontend/src/components/SettingsDialog.tsx ! No changes made

[sweep-ai-deprecated[bot]]

Here's the PR! https://github.com/abi/screenshot-to-code/pull/138.

⚡ Sweep Basic Tier: I'm using GPT-4. You have 4 GPT-4 tickets left for the month and 3 for the day. (tracking ID: fba7f75a3b)

For more GPT-4 tickets, visit our payment portal. For a one week free trial, try Sweep Pro (unlimited GPT-4 tickets).

---

Actions (click)

• [ ] ↻ Restart Sweep

Sandbox execution failed

The sandbox appears to be unavailable or down.

---

Step 1: 🔎 Searching

I found the following snippets in your repository. I will now analyze these snippets and come up with a plan.

Some code snippets I think are relevant in decreasing order of relevance (click to expand). If some file is missing from here, you can mention the path in the ticket description.

https://github.com/abi/screenshot-to-code/blob/226af5bf4183539c97c7bab825cb9324b8c570c0/frontend/src/components/SettingsDialog.tsx#L90-L111

---

Step 2: ⌨️ Coding

• [X] Modify frontend/src/components/SettingsDialog.tsx ✓ https://github.com/abi/screenshot-to-code/commit/98885299b10913af3c89dd56499edd5cf4c2a26d

Modify frontend/src/components/SettingsDialog.tsx with contents:
• Add a `Button` component after line 111 to serve as the "Reset" button.
• The button should have an `onClick` event handler that invokes a function to clear the browser's local storage.
• The function should be named `handleResetSettings` and defined within the `SettingsDialog` component. It will remove specific keys related to the settings from `localStorage`. To remove all keys, it can call `localStorage.clear()`.
• Add adequate padding or margin to separate the "Reset" button from the other form elements visually.
• Ensure the button text says "Reset to Defaults" and uses an appropriate style consistent with the rest of the application's design language.

• [X] Modify frontend/src/components/SettingsDialog.tsx ! No changes made

Modify frontend/src/components/SettingsDialog.tsx with contents:
• Make sure the new "Reset" button is outside of the Accordion component. The Accordion component starting at line 112 should remain unchanged.

---

Step 3: 🔁 Code Review

I have finished reviewing the code for completeness. I did not find errors for sweep/add-reset-button-settings-dialog.

---

🎉 Latest improvements to Sweep:

• Sweep uses OpenAI's latest Assistant API to plan code changes and modify code! This is 3x faster and significantly more reliable as it allows Sweep to edit code and validate the changes in tight iterations, the same way as a human would.
• Sweep now uses the rope library to refactor Python! Check out Large Language Models are Bad at Refactoring Code. To have Sweep refactor your code, try sweep: Refactor <your_file>.py!

---

💡 To recreate the pull request edit the issue title or description. To tweak the pull request, leave a comment on the pull request. ^{Join Our Discord}