From 605784e7223f217c1e64c8e038d963d0234c960f Mon Sep 17 00:00:00 2001
From: Khalim Conn-Kowlessar <kconnkowlessar@gmail.com>
Date: Thu, 13 Jul 2023 14:39:43 +0100
Subject: [PATCH] Added csv download example

---
 public/example_properties.csv                   |  2 ++
 src/app/components/portfolio/UploadCsvModal.tsx | 13 +++++++++++++
 tailwind.config.js                              | 13 ++++++++++++-
 3 files changed, 27 insertions(+), 1 deletion(-)
 create mode 100644 public/example_properties.csv

diff --git a/public/example_properties.csv b/public/example_properties.csv
new file mode 100644
index 00000000..58c2efb8
--- /dev/null
+++ b/public/example_properties.csv
@@ -0,0 +1,2 @@
+address,postcode,,,,,
+,,,,,,
\ No newline at end of file
diff --git a/src/app/components/portfolio/UploadCsvModal.tsx b/src/app/components/portfolio/UploadCsvModal.tsx
index dc812e9f..5b0f2582 100644
--- a/src/app/components/portfolio/UploadCsvModal.tsx
+++ b/src/app/components/portfolio/UploadCsvModal.tsx
@@ -9,6 +9,7 @@ import { Input } from "@/app/shadcn_components/ui/input";
 import { Label } from "@/app/shadcn_components/ui/label";
 import { useRouter } from "next/navigation";
 import { useMutation } from "@tanstack/react-query";
+import Link from "next/link";
 
 export const SubmitPlan = ({
   buttonDisabled,
@@ -416,6 +417,18 @@ export default function UploadCsvModal({
                     )}
                   </div>
 
+                  <div className="flex flex-col space-y-2 mt-7">
+                    <div className="text-sm font-semibold text-gray-600 relative leading-relaxed tracking-wider">
+                      Download the example csv and fill in the details for your
+                      properties
+                    </div>
+                    <div className="!text-blue-500 underline">
+                      <Link href="/example_properties.csv">
+                        Download example CSV
+                      </Link>
+                    </div>
+                  </div>
+
                   <div className="flex flex-col space-y-2 mt-7">
                     <div className="flex space-x-2">
                       <InputFile
diff --git a/tailwind.config.js b/tailwind.config.js
index 95b5342a..9731b113 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -103,5 +103,16 @@ module.exports = {
       visibility: ["group-hover"],
     },
   },
-  plugins: [],
+  plugins: [
+    function ({ addVariant }) {
+      addVariant("important", ({ container }) => {
+        container.walkRules((rule) => {
+          rule.selector = `.\\!${rule.selector.slice(1)}`;
+          rule.walkDecls((decl) => {
+            decl.important = true;
+          });
+        });
+      });
+    },
+  ],
 };