A05 All: Settings

[mo-jaber]

Description:

Allow all users/admin of the platform to modify their settings.

• All of the information taken at sign up can be accessed in /settings.
• Users/Admins will have the same view in settings.
• Profile information and password can be changed in /settings.
• Users can toggle between light and dark mode
• Users can delete their account

Acceptance Criteria:

0. Ensure the database schema structure is created and migration scripts run.

[0xdevcollins]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

My name is Collins Ikechukwu. I'm a full stack blockchain developer developer.

How I plan on tackling this issue

To implement the user and admin settings feature, I would create a /settings page accessible to both users and admins, ensuring that both roles have the same view for modifying their settings.

On this page, I will display all the information collected during sign-up, such as Name, Email, and Password. Users will have the ability to update their profile information, including changing their password. I’ll also include a toggle switch for users to switch between light and dark mode for a personalized interface.

Additionally, I’ll provide an option for users to delete their account. This feature will include a confirmation prompt to prevent accidental deletions. To ensure data integrity and a smooth user experience, I’ll implement appropriate backend logic to handle these updates and deletions while maintaining the necessary security measures. This design will empower users and admins to manage their profiles effectively while keeping the interface user-friendly.

[NueloSE]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

Am a frontend developer with experience in javascript react and typescript.

How I plan on tackling this issue

• I will create /settings page where users can edit their profile information.
• I willcreate theme toggle feature that allows users to switch between light and dark modes.
• create an account deletion feature that removes the user's account from the system.
• create a password change feature that allows users to update their passwords securely.

ETA <= 78hrs

[addegbenga]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am frontend engineer with over 5 years experience.

How I plan on tackling this issue

To tackle this issue:

• Save users info on localStorage on signup and create a hook to get them and display on settings page when they login
• Build the UI to change password and settings based on design and integrate API available
• Add a theming to the project using tailwind classes.
• Ability to delete account ETA: 3days

[Ugo-X]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I'm a Full Stack Blockchain Developer with demonstrable expertise across modern web and blockchain technologies. My tech stack centers on Next.js, TypeScript, React, and Node.js for web development, complemented by Three.js for 3D experiences, and Solidity/Rust for blockchain solutions.

What sets me apart is my proven track record on OnlyDust, where I've made 83 significant contributions across 15 different projects since Edition 1. This extensive involvement reflects my ability to deliver quality solutions under tight deadlines while adapting to diverse project requirements.

With my deep experience in hackathon environments, I bring both technical excellence and practical development skills to the table. I'm confident I can contribute meaningfully to pushing the boundaries of what's possible in blockchain development while maintaining a focus on user-centric solutions.

My profile (https://app.onlydust.com/u/Ugo-X) showcases my consistent ability to deliver results across various blockchain challenges. I'm excited to bring this experience and drive for innovation to your team.

How I plan on tackling this issue

1. Build Main Settings: I'll create a /settings page with standard tabs like profile, security, themes and account.

2. Add Profile Management: I'll build:

   • Basic profile editing
   • Avatar uploads
   • Quick notifications
   • Live validation

3. Security Setup: I'll implement:

   • Password changes
   • 2FA option
   • Session handling

4. Theme Options: I'll add:

   • Dark/light mode
   • System sync
   • Local storage saving

5. Account Tools: I'll create:

   • Account deletion flow
   • Data cleanup
   • Wallet disconnect

6. Testing Work: I'll test:

   • All forms
   • Theme switching
   • Mobile views
   • API integration

Timeline: 3-5 days to wrap up.

[melnikga]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

Hi, my name is Georgiy, I'm a frontend developer. I have extensive experience in developing tools for Starknet, and I've participated in almost all ODHacks, during which I worked on many projects. My OnlyDust profile: https://app.onlydust.com/u/melnikga

How I plan on tackling this issue

As I can see, your project already has a settings page file created. I would add a necessary form to display and modify user data, a theme toggle switch, and an account deletion button. To make everything look optimal, I would use components from shadcn. In the api folder, I would create everything needed for proper server interaction when modifying user data.

[saimeunt]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I'm the maintainer of op-scan (https://github.com/walnuthq/op-scan) a blockchain explorer with a very similar tech stack so I'm familiar with the patterns and best practices used in this project. I will use my XP in Full Stack Web3 Development to implement this issue.

How I plan on tackling this issue

The user story being self explanatory, I will carefully implement it using the latest Next.js best practices, choosing the right shadcn/ui component for the job.

[Benjtalkshow]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a Full Stack Developer specializing in Next.js, TypeScript, Node.js, Cairo and Rust . With over 31 contributions across projects in the OnlyDust ecosystem, I’ve developed strong proficiency in delivering high-quality solutions and resolving complex issues within tight deadlines. My experience spans frontend, backend, smart contracts, and the optimization and maintenance of scalable codebases.

How I plan on tackling this issue

I will create a comprehensive /settings page accessible to all users and admins, allowing them to modify their account settings. All the information provided during sign-up will be available for review and updates in this section. Both users and admins will have the same view, ensuring consistency across the platform. Users will be able to update their profile information and change their passwords directly from the settings page. Additionally, I will implement a toggle feature for switching between light and dark mode for a personalized user experience. Lastly, I will include an option for users to delete their accounts, ensuring they have full control over their data and privacy.

[Dprof-in-tech]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

Hello, I'm Dprof-in-tech, a seasoned Full Stack Blockchain Developer, and I'm excited to be part of ODHACK 9! I have a strong foundation in technologies such as Next.js, TypeScript, JavaScript, React, Node.js, Rust, and Cairo, I've built extensive experience across the blockchain development landscape.

I first got involved with OnlyDust during Edition 2, and since then, I've made 39 contributions across 11 different projects. Working on the platform has really helped me sharpen my skills, especially when it comes to delivering great solutions under tight deadlines. I love combining technical know-how with a user-focused approach, whether it's building immersive 3D experiences or crafting smart contracts that solve real-world problems.

Throughout, I've consistently demonstrated the ability to adapt and contribute effectively to diverse challenges. I'm confident in my ability to tackle new problems and drive innovation within the blockchain space. As we kick off ODHACK 9, I'm eager to apply my previous experience and technical expertise to push the boundaries of what's possible.

You can view my public profile on OnlyDust here: https://app.onlydust.com/u/Dprof-in-tech

How I plan on tackling this issue

Here's my approach to implementing the user settings page:

1. Settings Page Structure:

   • I'll create a unified /settings route accessible to all users
   • Implement tabs/sections for different setting categories:
     • Profile Information
     • Security
     • Appearance
     • Account Management

2. Profile Information Section:

   • Create editable form fields for signup data
   • Add real-time validation
   • Implement optimistic updates
   • Add avatar upload/management
   • Include success/error notifications with a custom notification component or toast notifications

3. Security Features:

   • Implement password change functionality
   • Add password strength indicators
   • Include current password verification
   • Add 2FA toggle (future-proofing)
   • Implement session management

4. Theme Management:

   • Add light/dark mode toggle
   • Store preference in local storage
   • Implement smooth theme transitions
   • Create system theme sync option
   • Ensure consistent styling across modes

5. Account Deletion:

   • Create secure deletion flow
   • Add confirmation modal
   • Implement data cleanup process
   • Handle blockchain wallet connections
   • Add recovery period option

Testing Plan:

• Form validation testing
• Theme switch testing
• API integration tests
• Security flow verification
• Mobile responsive testing
• Accessibility testing

Expected Timeline: 4-5 days

Key Considerations:

• Clean UI/UX
• Proper error handling
• Data persistence
• Security first approach
• Responsive design

[ShantelPeters]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I have a solid background in full-stack web development, including experience in building user management systems with customizable settings and user profiles. My expertise in both front-end and back-end technologies enables me to create intuitive interfaces while ensuring that user data is securely managed and updated in the database. Additionally, I am familiar with implementing features like light/dark mode toggling and account deletion, ensuring a comprehensive user experience.

How I plan on tackling this issue

To implement the user settings feature, I will begin by creating a /settings page accessible to all users and admins. This page will display the user's profile information, allowing them to modify their details and change their password. I will integrate a toggle switch for users to switch between light and dark modes, utilizing local storage to remember their preference.

For account deletion, I will provide a secure option that prompts the user to confirm their decision, ensuring they understand the consequences of deleting their account. This functionality will include a back-end endpoint to handle the deletion process, ensuring data integrity and security. Finally, I will thoroughly test the feature to confirm that all modifications are saved correctly in the database and that the user interface is intuitive and responsive.

[suhas-sensei]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

i have attend tsoc recently and i have experience in this project

[aniruddhaaps]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a python dev . A new-comer here, willing and ready to contribute to solve the issue.

[deeseeker]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a React developer with over two years of experience and have recently developed a strong interest in blockchain technology. I have valuable experience navigating codebases and have a strong knack for writing good functions.

ETA:2-3days

How I plan on tackling this issue

Clone the project on my pc Spin it up following the documentation Review the existing codebase Implement the function Test for all use cases Document the function

[mo-jaber]

@melnikga How are you going?

[melnikga]

@mo-jaber Hey, everything is fine, I'm working on the task, I will submit a PR in the next couple of days

[Dprof-in-tech]

I'm sorry, am I still unassigned nor I can start working on this issue??

[PoulavBhowmick03]

I am Poulav Bhowmick, a fullstack blockchain engineer, a Starknet Wolf and Superteam grants recipient. I have a good experience working with Next.js repositories, typescript and in UI UX

I will look at the user and admin pages, add the UI for letting them edit their details from the settings page, add the necessary db schema and then run the migration scripts for it to be up to date. Then I'll integrate the frontend with the backend drizzle and PostgreSQL.

ETA- 2 days

[ikemHood]

Hello @mo-jaber, I can create a PR within 24hrs if assigned

[Jemiiah]

@mo-jaber pls can I work on this

[mo-jaber]

Hey @PoulavBhowmick03

Clerk integration and user authentication is now working.

Here are the updated variables in the latest .env.example file

Related to the postgres db schema migration scripts https://vercel.com/docs/storage/vercel-postgres POSTGRES_URL= POSTGRES_DATABASE= POSTGRES_URL_NON_POOLING= POSTGRES_URL_NO_SSL= POSTGRES_PRISMA_URL= POSTGRES_USER= POSTGRES_PASSWORD= POSTGRES_HOST=

Related to clerk

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY= CLERK_SECRET_KEY= NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up

Let me know if you have any further questions