Feat: Algorithms UI enhancements and new algorithms

[kacienk]

Algorithms UI enhancements and new algorithms

This pull request introduces a series of updates to enhance the image processing functionality and improve the client-side user interface for managing algorithms. Key changes include the addition of new image processing functions, updates to the algorithm management interface, and code style improvements.

Backend Enhancements

Image Processing Features:

• Added gaussian_blur function to apply Gaussian blur to an image with a specified sigma value. This function validates input and handles image decoding and encoding.
• Added median_blur function to apply median filtering to an image using a specified kernel radius. This function also validates input and processes the image.
• Updated dependencies in Cargo.toml to include imageproc for advanced image processing capabilities.

Frontend Enhancements

Algorithm Management UI:

• Added AlgorithmsContainer component to manage a list of algorithms, including adding, removing, and reordering algorithms.
• Introduced AlgorithmBlock and its variants (GaussianBlurBlock, MedianBlurBlock, HotPixelsRemovalBlock, SimpleAlgorithmBlock) to represent different algorithm types with customizable parameters.
• Created AlgorithmBlockHeader for consistent header functionality across algorithm blocks, including enabling/disabling, reordering, and removing algorithms.

General Configuration

• Added a .prettierrc file to enforce consistent code formatting rules, such as single quotes, trailing commas, and arrow parentheses.

[Copilot]

Pull Request Overview

This pull request introduces a suite of enhancements for both the UI and backend to improve the algorithms management and image processing capabilities. Key changes include new image processing functions (Gaussian blur and median blur) with proper validations, a revamped algorithm management UI with modular blocks, and code style improvements such as the addition of a Prettier configuration.

Reviewed Changes

Copilot reviewed 17 out of 17 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
client/src/models/algorithms.ts	Added new algorithm types and default settings for image processing.
client/src/components/images/ImagePreview.tsx	Implemented responsive image preview with dynamic aspect ratio.
client/src/components/images/ImageConverter.tsx	Enhanced the image conversion process integrating new algorithms.
client/src/components/algorithms/AlgorithmsContainer.tsx	Updated UI for algorithm management with add, remove, and reorder functionality.
client/src/components/algorithms/AlgorithmBlock/*	Added modular blocks for different algorithm types.
client/src/app.tsx	Minor formatting updates and integration of the ImageConverter component.
api/src/lib.rs	Implemented new backend image processing functions (Gaussian and median blur).
api/Cargo.toml	Added imageproc dependency for advanced image processing.
.prettierrc	Enforced consistent code formatting rules.

Comments suppressed due to low confidence (1)

client/src/components/images/ImagePreview.tsx:41

• [nitpick] Storing the aspect ratio as a fixed string value may affect downstream CSS computations. Ensure that downstream components consuming this style property correctly handle the value type.

aspectRatio: aspectRatio.toFixed(5),

[grzanka]

LGTM, works well on photos and similar images. To really evaluate the algorithms I would need to have a proper colorbar and colorscale with the numbers I could interpret.

[grzanka]

See also related comment here: #10 (comment)

[jkbstepien]

Approve also on my side. Good job managing types on client side and implementing config blocks for different algos :))