nothing borrowed panel

src/components/NothingBorrowedPanel/index.tsx

@@ -0,0 +1,35 @@
+import { Button, Card } from "antd";
+import React from "react";
+import { LABELS } from "../../constants";
+import { Link } from "react-router-dom";
+
+export const NothingBorrowedPanel = () => {
+  const bodyStyle: React.CSSProperties = {
+    display: "flex",
+    flex: 1,
+    justifyContent: "center",
+    alignItems: "center",
+    height: "100%",
+  };
+
+  return (
+    <Card bodyStyle={bodyStyle}>
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "column",
+          justifyContent: "space-around",
+        }}
+      >
+        <strong>{LABELS.NOTHING_BORROWED}</strong>
+        <br />
+        <p>{LABELS.NOTHING_BORROWED_MESSAGE}</p>
+        <Link to="/borrow">
+          <Button type="primary" size={"large"}>
+            <span>{LABELS.BORROW_NOW}</span>
+          </Button>
+        </Link>
+      </div>
+    </Card>
+  );
+};

src/constants/labels.ts

@@ -40,6 +40,10 @@ export const LABELS = {
   NO_COLLATERAL: "No collateral",
   NO_DEPOSITS: "No deposits",
   NO_LOANS: "No loans",
+  NOTHING_BORROWED: "Nothing borrowed yet",
+  NOTHING_BORROWED_MESSAGE:
+    "There will be a list of all the assets you have borrowed. For now, it's empty since you have not borrowed.",
+  BORROW_NOW: "Borrow now",
   LIQUIDATE_QUESTION: "How much would you like to liquidate?",
   LIQUIDATE_ACTION: "Liquidate",
   LIQUIDATE_NO_LOANS: "There are no loans to liquidate.",

src/views/dashboard/index.tsx

@@ -6,6 +6,7 @@ import { useUserDeposits, useUserObligations } from "./../../hooks";
 import { DashboardObligations } from "./obligation";
 import { DashboardDeposits } from "./deposit";
 import "./style.less";
+import { NothingBorrowedPanel } from "../../components/NothingBorrowedPanel";
 
 export const DashboardView = () => {
   const { connected } = useWallet();
@@ -45,7 +46,7 @@ export const DashboardView = () => {
             {userObligations.length > 0 ? (
               <DashboardObligations />
             ) : (
-              <Card>{LABELS.NO_LOANS}</Card>
+              <NothingBorrowedPanel />
             )}
           </Col>
         </Row>