mirror of
https://github.com/CommunityOx/ox_lib.git
synced 2026-08-18 23:46:03 +01:00
fix(web/progress): remove cancelled timeout animation
This is not a fix, it's a workaround, removes the red animation when cancelling due to it causing the progress bar/circle to be permanently stuck
This commit is contained in:
@@ -42,9 +42,7 @@ const CircleProgressbar: React.FC = () => {
|
|||||||
const progressCancel = () => {
|
const progressCancel = () => {
|
||||||
setCancelled(true);
|
setCancelled(true);
|
||||||
setValue(99); // Sets the final value to 100% kek
|
setValue(99); // Sets the final value to 100% kek
|
||||||
setTimeout(() => {
|
setVisible(false);
|
||||||
setVisible(false);
|
|
||||||
}, 2500);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
useNuiEvent("progressCancel", progressCancel);
|
useNuiEvent("progressCancel", progressCancel);
|
||||||
@@ -77,10 +75,7 @@ const CircleProgressbar: React.FC = () => {
|
|||||||
alignItems="center"
|
alignItems="center"
|
||||||
>
|
>
|
||||||
{visible && (
|
{visible && (
|
||||||
<Flex
|
<Flex alignItems="center" flexDirection="column">
|
||||||
alignItems= "center"
|
|
||||||
flexDirection="column"
|
|
||||||
>
|
|
||||||
<CircularProgress
|
<CircularProgress
|
||||||
value={value}
|
value={value}
|
||||||
size="5rem"
|
size="5rem"
|
||||||
@@ -99,6 +94,7 @@ const CircleProgressbar: React.FC = () => {
|
|||||||
},
|
},
|
||||||
}
|
}
|
||||||
: {
|
: {
|
||||||
|
// Currently unused
|
||||||
".chakra-progress__indicator": {
|
".chakra-progress__indicator": {
|
||||||
transition: "none !important",
|
transition: "none !important",
|
||||||
strokeDasharray: "264, 0 !important", // sets circle to full
|
strokeDasharray: "264, 0 !important", // sets circle to full
|
||||||
@@ -110,12 +106,7 @@ const CircleProgressbar: React.FC = () => {
|
|||||||
{value}%
|
{value}%
|
||||||
</CircularProgressLabel>
|
</CircularProgressLabel>
|
||||||
</CircularProgress>
|
</CircularProgress>
|
||||||
<Text
|
<Text fontFamily="Inter" isTruncated fontSize={18} fontWeight="light">
|
||||||
fontFamily="Inter"
|
|
||||||
isTruncated
|
|
||||||
fontSize={18}
|
|
||||||
fontWeight="light"
|
|
||||||
>
|
|
||||||
{label}
|
{label}
|
||||||
</Text>
|
</Text>
|
||||||
</Flex>
|
</Flex>
|
||||||
|
|||||||
@@ -32,9 +32,7 @@ const Progressbar: React.FC = () => {
|
|||||||
|
|
||||||
const progressCancel = () => {
|
const progressCancel = () => {
|
||||||
setCancelled(true);
|
setCancelled(true);
|
||||||
setTimeout(() => {
|
setVisible(false);
|
||||||
setVisible(false);
|
|
||||||
}, 2500);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
useNuiEvent("progressCancel", progressCancel);
|
useNuiEvent("progressCancel", progressCancel);
|
||||||
@@ -77,6 +75,7 @@ const Progressbar: React.FC = () => {
|
|||||||
animationDuration: `${duration}ms`,
|
animationDuration: `${duration}ms`,
|
||||||
}
|
}
|
||||||
: {
|
: {
|
||||||
|
// Currently unused
|
||||||
width: "100%",
|
width: "100%",
|
||||||
animationPlayState: "paused",
|
animationPlayState: "paused",
|
||||||
backgroundColor: "rgb(198, 40, 40)",
|
backgroundColor: "rgb(198, 40, 40)",
|
||||||
|
|||||||
Reference in New Issue
Block a user