opensource/filestash
1
0
Fork 0
mirror of https://github.com/mickael-kerjean/filestash.git synced 2025-11-04 13:35:46 +08:00
Code Issues Packages Projects Releases Wiki Activity

maintain (admin): admin page upgrade

Browse Source
This commit is contained in:
Mickael Kerjean
2021-08-16 02:09:24 +10:00
parent 6e27086ac4
commit 44fc901b4b
13 changed files with 346 additions and 349 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
client/components/animation.js
View File

@ -7,24 +7,20 @@ import React, { useState, useEffect } from "react";
* to realise it would be easier to write this simpler wrapper than migrate things over
*/
export function CSSTransition({ transitionName = "animate", children = null, transitionAppearTimeout = 300 }) {
const [child, setChildren] = useState(React.cloneElement(children, {
className: `${children.props.className} ${transitionName}-appear`
}));
const [className, setClassName] = useState(`${transitionName} ${transitionName}-appear`);
useEffect(() => {
setChildren(React.cloneElement(child, {
className: `${children.props.className} ${transitionName}-appear ${transitionName}-appear-active`
}))
const timeout = setTimeout(() => {
setChildren(React.cloneElement(child, {
className: `${children.props.className}`
}))
}, transitionAppearTimeout);
setClassName(`${transitionName} ${transitionName}-appear ${transitionName}-appear-active`)
return () => {
clearTimeout(timeout);
};
const timeout = setTimeout(() => {
setClassName(`${transitionName}`)
}, transitionAppearTimeout);
return () => clearTimeout(timeout);
}, []);
return child;
return (
<div className={className}>
{ children }
</div>
)
}