[BUG] Global loading state affects both compress and decompress buttons #1

Description:

Current Behavior:
When an API call is initiated (e.g., clicking "Compress"), a single loading state is activated. This causes both the "Compress" and "Decompress" buttons to enter a disabled, loading state simultaneously (e.g., showing "Compressing..." and "Decompressing..."). The same issue occurs in reverse when clicking the "Decompress" button.

Expected Behavior:

• When the Compress button is clicked, only the Compress button should show a "Compressing..." state. The Decompress button should be disabled but its text should not change.
• When the Decompress button is clicked, only the Decompress button should show a "Decompressing..." state. The Compress button should be disabled but its text should not change.

Root Cause:
The application currently uses a single, shared loading state variable in the App.js component to manage the loading status for both compression and decompression API calls.

Suggested Solution:
Refactor the state management to use separate loading state variables for each action. For example, instead of a single loading state, implement two distinct states:

• isCompressing
• isDecompressing

Update the button components to conditionally render their text and disabled status based on these more specific states.

Screenshot of the Issue: