Add file type validation for image uploads

[01bps]

What:

Implemented client and server-side validation to restrict image upload types to specific formats (.jpg, .jpeg, .png, .gif, .webp, .heif and .pdf).

Why:

• Prevent users from uploading unsupported file formats
• Improve user experience by providing immediate feedback
• Reduce server load by filtering invalid files before upload

How:

1. Added client-side validation:

   • File type restrictions in file picker dialog
   • JavaScript validation to disable upload button for invalid files
   • Immediate user feedback for invalid selections

2. Added server-side validation:

   • Implemented ALLOWED_EXTENSIONS check
   • Added allowed_file() helper function
   • Modified upload_image route to validate files

3. User Interface Updates:

   • Added error message display for invalid files
   • Disabled upload button when invalid file is selected
   • Added accept attribute to file input for better UX

Testing:

• Verified validation works for all supported file types
• Confirmed error messages display correctly
• Validated both client and server-side checks working

Screenshot:

Checklist:

• You have signed off your commits
• The title for your pull request (PR) should follow our title convention. Learn more about the pull request title convention used in this repository

[01bps]

Hi @mdxabu ,
I’ve pushed the latest updates and resolved all the conflicts. Please let me know if there’s anything else required.

Thanks!

[mdxabu]

@01bps, Did you pull the recent commit that I merged this morning?

[01bps]

@01bps, Did you pull the recent commit that I merged this morning?

The commits merged today were in the main branch. This PR is directed to the dev branch and is up to date with it. Would you like me to update the branch from dev to main and make the necessary updates?

[01bps]

@mdxabu Should we merge this into the main branch as well (As discussed in #30 )? This will help ensure file validation for the drag-and-drop feature.

[01bps]

@mdxabu Should we merge this into the main branch as well (As discussed in #30 )? This will help ensure file validation for the drag-and-drop feature.

@mdxabu ,
or I should direct the drag and drop feature to the dev branch only?

[mdxabu]

@mdxabu Should we merge this into the main branch as well (As discussed in #30 )? This will help ensure file validation for the drag-and-drop feature.

@mdxabu , or I should direct the drag and drop feature to the dev branch only?

It will be good for main branch too.

[01bps]

@mdxabu Should we merge this into the main branch as well (As discussed in #30 )? This will help ensure file validation for the drag-and-drop feature.

@mdxabu , or I should direct the drag and drop feature to the dev branch only?

It will be good for main branch too.

Alright, I'll create a PR for the main branch as well.