feat: add drag-and-drop logo upload for organizations

[imrja8]

What is this PR about?

This PR introduces a drag-and-drop feature for uploading Organization Profiles/Logos. It brings parity to how icons are managed elsewhere in the application, but with a heavy emphasis on security, performance, and user experience:

User Experience (UX)

• Drag-and-Drop Integration: Integrated the Dropzone component into the "Add/Update Organization" dialog for seamless file uploads.
• Intelligent Input Masking: Instead of cluttering the "Logo URL" input with a massive Base64 string upon upload, the input gracefully masks it by displaying the uploaded filename (e.g., logo.png) or a fallback "Uploaded image" text, while dynamically setting the field to read-only.
• Instant Preview & Layout Stability: Added a fixed-size thumbnail preview next to the input field. It defaults to a GlobeIcon and instantly swaps to the uploaded image without causing jarring layout shifts.
• Quick Clear: Added a convenient "X" button inside the input field to easily discard uploaded images and revert to entering a custom URL.
• Dialog Stability Fix: Resolved a native UI conflict where clicking the file picker inside a nested DropdownMenu caused the dialog to prematurely close. Fixed by decoupling the AddOrganization dialog from the dropdown trigger.

Security

• SVG Sanitization: All .svg uploads are parsed through DOMPurify before being converted to a data URL, mitigating any potential Cross-Site Scripting (XSS) risks from malicious scripts embedded in the XML.

Performance

• Client-Side Compression: To prevent severe database bloat on the organization table, any raster images (JPG, PNG, WebP) uploaded via the dropzone are instantly processed through a background HTML Canvas, resized to a maximum of 256x256 pixels, and compressed into the highly efficient WebP format. This shrinks typical 2MB user uploads to roughly ~15KB before they ever hit the database.

Why and How

Users requested the ability to easily upload organization logos. However, storing raw, massive Base64 images directly into the PostgreSQL TEXT column creates unnecessary network/DB bottlenecks. Utilized FileReader to extract file contents, DOMPurify for SVG cleaning, and a native canvas context for downscaling raster images. Furthermore, the global Dropzone UI component was updated with a new classNameContent prop to allow targeted height overrides, ensuring this specific dropzone fits the form perfectly without affecting global instances.

Verification

• Tested manually in the browser.
• Verified dialog stability (no auto-close on file picker focus loss).
• Confirmed SVG sanitization strips arbitrary tags.
• Verified client-side compression drastically shrinks the Base64 payload prior to form submission.
• Checked local formatting and changes.

Checklist

Before submitting this PR, please make sure that:

• You created a dedicated branch based on the canary branch.
• You have read the suggestions in the CONTRIBUTING.md file https://github.com/Dokploy/dokploy/blob/canary/CONTRIBUTING.md#pull-request
• You have tested this PR in your local instance. If you have not tested it yet, please do so before submitting. This helps avoid wasting maintainers' time reviewing code that has not been verified by you.

Issues related (if applicable)

closes #4727

Screenshots (if applicable)

• Custom URL Input Working Perfectly
  

• Drag and Drop Working Perfectly