1  // SPDX-FileCopyrightText: 2024 Mass Labs
 2  //
 3  // SPDX-License-Identifier: GPL-3.0-or-later
 4  import { Link } from "@tanstack/react-router";
 5  
 6  import Transactions from "./Transactions.tsx";
 7  import ButtonLink from "../common/ButtonLink.tsx";
 8  export default function MerchantDashboard() {
 9    return (
10      <main
11        className="p-4 md:flex justify-center h-screen"
12        data-testid="merchant-dashboard-screen"
13      >
14        <section className="md:w-[560px]">
15          <section className="mb-4">
16            <h1>Dashboard</h1>
17            <div className="flex flex-col gap-1 pt-4">
18              <Link
19                className="flex items-center gap-1 p-3 bg-white rounded-md"
20                to="/edit-listing"
21                search={(prev: Record<string, string>) => ({
22                  shopId: prev.shopId,
23                })}
24                style={{ color: "black" }}
25              >
26                Add new product
27                <img
28                  src={`/icons/chevron-right.svg`}
29                  width={8}
30                  height={8}
31                  alt="chevron-right"
32                  className="w-2 h-2 ml-auto"
33                />
34              </Link>
35              <Link
36                className="flex items-center gap-1 p-3 bg-white rounded-md"
37                to="/listings"
38                search={(prev: Record<string, string>) => ({
39                  shopId: prev.shopId,
40                })}
41                style={{ color: "black" }}
42              >
43                <p>View products</p>
44                <img
45                  src={`/icons/chevron-right.svg`}
46                  width={8}
47                  height={8}
48                  alt="chevron-right"
49                  className="w-2 h-2 ml-auto"
50                />
51              </Link>
52  
53              <Link
54                to="/settings"
55                search={(prev: Record<string, string>) => ({
56                  shopId: prev.shopId,
57                })}
58                className="flex items-center gap-1 p-3 bg-white rounded-md"
59                style={{ color: "black" }}
60              >
61                <p>Shop settings</p>
62                <img
63                  src={`/icons/chevron-right.svg`}
64                  width={8}
65                  height={8}
66                  alt="chevron-right"
67                  className="w-2 h-2 ml-auto"
68                />
69              </Link>
70            </div>
71          </section>
72          <h2>Latest Orders</h2>
73          <Transactions displayFive />
74          <div className="flex justify-center mt-3">
75            <ButtonLink to="/orders">View all orders</ButtonLink>
76          </div>
77        </section>
78      </main>
79    );
80  }