diff --git a/src/assets/icons/eye-slash.svg b/src/assets/icons/eye-slash.svg new file mode 100644 index 0000000..d98cf8d --- /dev/null +++ b/src/assets/icons/eye-slash.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/eye.svg b/src/assets/icons/eye.svg index 894cd61..af8f3ed 100644 --- a/src/assets/icons/eye.svg +++ b/src/assets/icons/eye.svg @@ -6,6 +6,6 @@ + fill="#0a0a0a" /> \ No newline at end of file diff --git a/src/components/_home/_Home.tsx b/src/components/_home/_Home.tsx index d34f3a9..50878fc 100644 --- a/src/components/_home/_Home.tsx +++ b/src/components/_home/_Home.tsx @@ -2,6 +2,8 @@ import { Loader, Table, Text } from "@mantine/core"; import { useDisclosure } from "@mantine/hooks"; import { useNavigate } from "react-router"; import AddCircle from "../../assets/icons/add_circle.svg"; +import Eye from "../../assets/icons/eye.svg"; +import EyeSlash from "../../assets/icons/eye-slash.svg"; import FileTypeJson from "../../assets/icons/bi_filetype-json.svg"; import Logo from "../../assets/icons/logo.svg"; import { parseTimestamp } from "../../lib/date/parseTimestamp"; @@ -9,11 +11,19 @@ import { useProjects } from "../../lib/operators/useProjects"; import { Action } from "./Action"; import { CreateTestbookModal } from "./CreateTestbookModal"; import classes from "./home.module.scss"; +import { useState } from "react"; export function _Home() { const projects = useProjects(); const navigate = useNavigate(); const [opened, { open, close }] = useDisclosure(false); + const [testsVisible, setTestsVisibility] = useState(true); + const invisibilityPlaceholder = "************"; + + const toggleTestsVisibility = () => { + setTestsVisibility(!testsVisible); + }; + return (
@@ -49,7 +59,18 @@ export function _Home() { ) : ( <> -
Last testbooks
+
+
Last testbooks
+
+ +
+
navigate(`/project/${item.id}`)} > - {item.title} - {item.customer} + + {testsVisible ? item.title : invisibilityPlaceholder} + + + {testsVisible ? item.customer : invisibilityPlaceholder} + {parseTimestamp(item.createdAt)} diff --git a/src/components/_home/home.module.scss b/src/components/_home/home.module.scss index 18447a2..cba15d9 100644 --- a/src/components/_home/home.module.scss +++ b/src/components/_home/home.module.scss @@ -77,11 +77,16 @@ } .tableTitle { - text-align: left; + display: flex; + justify-content: space-between; font-size: 20px; font-weight: 700; width: 100%; margin-bottom: 15px; + button { + all: unset; + cursor: pointer; + } } thead {