Form to Create New Payment Links

[MPSxDev]

Form to Create New Payment Links

Description

A form needs to be created for adding new payment links. This form should include input fields for the necessary details: name, currency, price, SKU or ID, and an option to upload a featured image.

Requirements

• Input Fields:
  • Name: A text input for the name of the product or service.
  • Currency: A dropdown or select input to choose the currency.
  • Price: A numeric input field for the price of the item or service.
  • SKU or ID: A text input for entering the SKU or unique identifier.
  • Featured Image: An upload input to allow users to select and upload an image that represents the payment link.
• Responsive Design: Ensure that the layout is responsive and user-friendly across different devices.
• Validation: Implement basic validation for required fields (e.g., name, price).

Technical Considerations

• Use TailwindCSS for styling and layout to maintain consistency with the rest of the application.
• Ensure that components are implemented using shadcn/ui and Radix UI for enhanced user experience.
• Follow TypeScript conventions for form handling and validation.

Tasks

1. Design the layout of the form for creating new payment links with appropriate input fields.
2. Implement each input field with necessary props and validation logic.
3. Style the form using TailwindCSS classes to ensure a cohesive design.

Notes

This form will be integrated into the payment link creation workflow and should align with existing design patterns in the application. This is just a design, the button to create a new link should not do any function for now.

Figma Reference

You can use the Figma design linked here as a reference, but feel free to use the previously mentioned components as a guide.

[Kingsuite]

Can I work on this, please?

[Mystic-Nayy]

May I handle this issue? i am a frontend developer i will use ShadCN UI components (e.g., Input, Select) with TailwindCSS classes to build a responsive form for name, currency, price, SKU, and image upload. Manage state and validation using TypeScript, ensuring required fields like name and price have basic checks.

[jaykayudo]

Could I take over this issue?

[josephchimebuka]

Hello I am Joseph I am a frontend developer and blockchain developer and I am also an active contributor here on only dust here is my profile https://app.onlydust.com/u/josephchimebuka. This is my first time to contribute to this repo ill appreciate the opportunity to contribute. this is a couple of frontend and blockchain projects i have built https://metacrypt.vercel.app/ https://mattedsgn.com/ May I try this one?

[BrunoAmbricca]

I would like to work on this issue

[starknetbrother]

Could I try solving this?

[myspace20]

I am a developer with over two years of experience and I can handle this issue in less than 10hrs.

[Unickhub]

Is it okay if I tackle this?

[KevinLatino]

Hello @MPSxDev My name is Kevin Latino, and I'm a Frontend Developer and active open-source contributor. I'm a member of Dojo Coding ⛩️, a thriving Web3 community in Costa Rica. I have experience with React, Next.js, and TypeScript, also I have experience in data fetching and API integrations and I recently won the LATAM Hackathon hosted by Base. I've also contributed to projects in ecosystems like Starknet and Stellar.

I'll design a responsive form for creating new payment links, with fields for name, currency, price, SKU/ID, and a featured image upload. The form will be styled with TailwindCSS, using shadcn/ui and Radix UI components for a smooth experience. Basic validation will be added for required fields like name and price. The "Create Payment Link" button will be non-functional for now, and I'll follow the Figma design for consistency.

Here is an example of a Frontend Project that I have made: https://buildmyevent.xyz/

[Benjtalkshow]

I'd like to handle this task. I am a Full Stack Developer with a strong background in blockchain and extensive experience in Next.js/React, TypeScript, and Rust. I’ve made over 45 contributions to over 15 projects in the OnlyDust ecosystem, solving complex issues and delivering efficient, scalable solutions.

MY ETA is 48hrs. Thanks

[ShantelPeters]

Can I work on this, please?

[Michaelkingsdev]

I’d like to help with this.

[MullerTheScientist]

I am a full-stack developer with experience in QA testing and languages like Python, Cairo, Solidity, React, and JavaScript. I'd love to give this a go

[chibokaxavier]

Hi, i am Chiboka Emmanuel a full-stack web developer who enjoys creating solutions and applications that look great and work smoothly. I would really love to be assigned this issue and work on this project.

[martinvibes]

Can I take care of this issue? i'm a frontend dev and a blockchain dev please kindly assign :)

[Kaminar-i]

Mind if I take this issue? i'm new and would love to work on this please assign me

[mimisavage]

May I try my hand at this?

[hossamanany]

Can I attempt this issue?

[Jethrolopwus]

Hi, I'm Jethro Lopwus a react.js/next.js front end developer. I will want to implement this form and validate the necessary input fields using react-hook-form react package. also I will style using tailwind css classes. please I will be glad to implement this as a first contributor.

[Jethrolopwus]

acknowledge with thanks

On Fri, Nov 22, 2024 at 3:25 PM onlydustapp[bot] @.***> wrote:

Assigned #12 https://github.com/PayStell/paystell-website/issues/12 to @Jethrolopwus https://github.com/Jethrolopwus.

— Reply to this email directly, view it on GitHub https://github.com/PayStell/paystell-website/issues/12#event-15398242232, or unsubscribe https://github.com/notifications/unsubscribe-auth/AXWLMOIPRTEA74NX6FDS57L2B45EXAVCNFSM6AAAAABSGDGHA2VHI2DSMVQWIX3LMV45UABCJFZXG5LFIV3GK3TUJZXXI2LGNFRWC5DJN5XDWMJVGM4TQMRUGIZDGMQ . You are receiving this because you were assigned.Message ID: @.***>