Fix: #590 cloud computing ux consistency

[FlorentinoG9]

Fix: Cloud Computing UX Consistency

Fixes Issue: #590

Overview

This PR refactors the Cloud Computing tab to improve UI consistency and user experience by introducing reusable form components and standardizing button styling across the interface.

Changes Made

🎨 New Reusable Components

• Form_Input.qml: A standardized input field component with consistent styling, labels, and focus states
• Form_File_Input.qml: A file/directory selector component that encapsulates file dialog functionality with support for both file and directory selection
• Button_Primary.qml: A primary button component with consistent styling, hover effects, and animations

✨ Cloud Computing Tab Improvements

• Refactored UI: Replaced all standard input fields and buttons with the new reusable components
• Enhanced File Dialogs:
  • Added support for folder selection in file dialogs
  • Improved file path handling and conversion from QUrl to local file paths
  • Clear default text in target directory input on focus
• Improved Input Fields:
  • Added placeholders for better user guidance
  • Cleared default text in password and target directory fields
  • Enhanced visual feedback with focus states
• Button Functionality:
  • Fully implemented Clear Config button functionality
  • Connected Upload button to properly pass all form values
  • Standardized button appearance with Button_Primary component
• Code Cleanup: Removed obsolete button connections from GUI5.py as file dialogs are now handled internally within components

🧹 Project Maintenance

• Cleaned up .gitignore to remove redundant QML cache entries
• Added .DS_Store to .gitignore for better macOS file management

Benefits

• Consistency: All form inputs and buttons now follow the same design pattern
• Maintainability: Reusable components reduce code duplication and simplify future updates
• User Experience: Better visual feedback, clearer placeholders, and improved file selection workflow
• Code Quality: Cleaner, more modular code structure

Files Changed

• CloudComputing.qml - Complete UI refactoring
• GUI5.py - Removed obsolete button connections
• GUI_Components/Form_Input.qml - New component (created)
• GUI_Components/Form_File_Input.qml - New component (created)
• GUI_Components/Button_Primary.qml - New component (created)
• .gitignore - Cleanup and macOS support

Testing

• ✅ Tested file selection dialog functionality
• ✅ Tested folder selection dialog functionality
• ✅ Verified Clear Config button clears all form fields
• ✅ Verified Upload button passes correct parameters
• ✅ Confirmed consistent styling across all form elements

[3C-SCSU]

Code approval process -- 3 Steps review:
(1) Yes; (2) Maybe; (3) No; > {Number of files, and total lines changed:add/delete lines} [Reasoning]
Example:

• Feedback >> (2) > {4: +153/-20} [ Code needs to explain what it does ]

[3C-SCSU]

Code approval process -- 3 Steps review:
(1) Yes; (2) Maybe; (3) No; > {Number of files, and total lines changed:add/delete lines} [Reasoning]
Example:

• Feedback >> (2) > {4: +153/-20} [ Code needs to explain what it does ]

[3C-SCSU]

Ticket solved: #590