Added file scanning module.
This commit is contained in:
23
src/components/atoms/last-scanned/last-scanned.atom.jsx
Normal file
23
src/components/atoms/last-scanned/last-scanned.atom.jsx
Normal file
@@ -0,0 +1,23 @@
|
||||
import { Typography } from "antd";
|
||||
import React from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectScanLastScanned } from "../../../redux/scan/scan.selectors";
|
||||
import TimeAgoFormatter from "../../atoms/time-ago-formatter/time-ago-formatter.atom";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
lastScanned: selectScanLastScanned,
|
||||
});
|
||||
const mapDispatchToProps = (dispatch) => ({});
|
||||
|
||||
export function LastScannedAtom({ lastScanned }) {
|
||||
return (
|
||||
lastScanned && (
|
||||
<Typography.Title level={5}>
|
||||
<span>Last scanned </span>
|
||||
<TimeAgoFormatter>{lastScanned}</TimeAgoFormatter>
|
||||
</Typography.Title>
|
||||
)
|
||||
);
|
||||
}
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(LastScannedAtom);
|
||||
22
src/components/atoms/scan-refresh/scan-refresh.atom.jsx
Normal file
22
src/components/atoms/scan-refresh/scan-refresh.atom.jsx
Normal file
@@ -0,0 +1,22 @@
|
||||
import { Button } from "antd";
|
||||
import React from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { scanStart } from "../../../redux/scan/scan.actions";
|
||||
import { selectScanLoading } from "../../../redux/scan/scan.selectors";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
scanLoading: selectScanLoading,
|
||||
});
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
scanStart: () => dispatch(scanStart()),
|
||||
});
|
||||
|
||||
export function ScanRefreshAtom({ scanLoading, scanStart }) {
|
||||
return (
|
||||
<Button onClick={() => scanStart()} loading={scanLoading}>
|
||||
Refresh
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(ScanRefreshAtom);
|
||||
@@ -1,12 +1,19 @@
|
||||
import { Tooltip } from "antd";
|
||||
import moment from "moment";
|
||||
import React from "react";
|
||||
import React, { useEffect, useState } from "react";
|
||||
|
||||
export default function TimeAgoFormatter(props) {
|
||||
const [timestampString, setTimestampString] = useState("");
|
||||
const m = moment(props.children);
|
||||
useEffect(() => {
|
||||
const timer = setInterval(() => setTimestampString(m.fromNow()), 15000);
|
||||
setTimestampString(m.fromNow());
|
||||
return () => clearInterval(timer);
|
||||
}, [m]);
|
||||
|
||||
return props.children ? (
|
||||
<Tooltip placement="top" title={m.format("MM/DD/YYY hh:mm A")}>
|
||||
{m.fromNow()}
|
||||
{timestampString}
|
||||
</Tooltip>
|
||||
) : null;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user