Fix icons

hill · Nov 13, 2024 · 1bcacea · 1bcacea
1 parent 508a628
commit 1bcacea
Show file tree

Hide file tree

Showing 7 changed files with 31 additions and 19 deletions.
diff --git a/biome.json b/biome.json
@@ -25,6 +25,9 @@
         "useAltText": "off",
         "noSvgWithoutTitle": "off",
         "useKeyWithClickEvents": "off"
+      },
+      "suspicious": {
+        "noArrayIndexKey": "off"
       }
     }
   },

diff --git a/docs/formats.md b/docs/formats.md
@@ -47,4 +47,9 @@ Represents sequence variation (e.g. SNPs, indels, structural variants, alternati
 
 ## PDB (protein data bank format)
 
-Representing 3d strucutres of molecules / proteins
+Representing 3d strucutres of molecules / proteins
+
+## Genbank File Format
+
+https://www.ncbi.nlm.nih.gov/genbank/samplerecord/
+
diff --git a/examples/.DS_Store b/examples/.DS_Store
diff --git a/src/assets/icons.tsx b/src/assets/icons.tsx
@@ -1,6 +1,6 @@
 import type { SVGProps } from "react";
 
-function createIcon(svgPath: string) {
+function createIcon(svgPaths: string[], overrides?: SVGProps<SVGSVGElement>) {
   return function Icon(props: SVGProps<SVGSVGElement>) {
     return (
       <svg
@@ -11,19 +11,32 @@ function createIcon(svgPath: string) {
         viewBox="0 0 16 16"
         width="16"
         height="16"
+        {...overrides}
         {...props}
       >
-        <path d={svgPath} />
+        {svgPaths.map((path, index) => (
+          <path key={index} d={path} />
+        ))}
       </svg>
     );
   };
 }
-export const DirectoryIcon = createIcon(
+export const DirectoryIcon = createIcon([
   "M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z",
-);
-export const DirectoryOpenIcon = createIcon(
+]);
+export const DirectoryOpenIcon = createIcon([
   "M.513 1.513A1.75 1.75 0 0 1 1.75 1h3.5c.55 0 1.07.26 1.4.7l.9 1.2a.25.25 0 0 0 .2.1H13a1 1 0 0 1 1 1v.5H2.75a.75.75 0 0 0 0 1.5h11.978a1 1 0 0 1 .994 1.117L15 13.25A1.75 1.75 0 0 1 13.25 15H1.75A1.75 1.75 0 0 1 0 13.25V2.75c0-.464.184-.91.513-1.237Z",
-);
-export const FileIcon = createIcon(
+]);
+export const FileIcon = createIcon([
   "M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z",
+]);
+// Attribution: Noun Project / Ronald Vermeijs
+export const DNAIcon = createIcon(
+  [
+    "M35.22,68.92c-1.38,0.18-2.35,1.44-2.17,2.82c0.61,4.73,0.99,13.32-3.37,17.68c-0.98,0.98-0.98,2.57,0,3.55   c0.49,0.49,1.13,0.74,1.78,0.74c0.64,0,1.29-0.25,1.78-0.74c5.59-5.59,5.69-14.98,4.8-21.88C37.86,69.71,36.6,68.74,35.22,68.92z",
+    "M61.91,29.25c0.08,0,0.16,0,0.24-0.01c1.38-0.13,2.39-1.36,2.26-2.74c-0.23-2.41-0.3-5.2,0.05-7.88l11.11,11.11   c0.49,0.49,1.13,0.74,1.78,0.74c0.64,0,1.29-0.25,1.78-0.74c0.98-0.98,0.98-2.57,0-3.56L66.07,13.09c0.5-0.99,1.12-1.9,1.9-2.68   c0.98-0.98,0.98-2.57,0-3.56c-0.98-0.98-2.57-0.98-3.55,0c-4.13,4.13-5.86,11.09-5,20.11C59.54,28.27,60.63,29.25,61.91,29.25z",
+    "M91.89,30.78c-0.98-0.98-2.57-0.98-3.55,0c-3.51,3.51-9.74,3.94-14.35,3.68c-2.95-0.17-5.63-0.63-7.45-1.02l-2.28-0.66   c-0.81-0.24-20.07-5.69-29.13,3.37c-5.38,5.38-5.65,14.34-4.92,20.9c0.14,1.29,1.23,2.24,2.5,2.24c0.09,0,0.19-0.01,0.28-0.02   c1.38-0.15,2.37-1.4,2.22-2.78c-0.27-2.41-0.39-5.18-0.11-7.87l10.45,10.45c0.49,0.49,1.13,0.74,1.78,0.74   c0.64,0,1.29-0.25,1.78-0.74c0.98-0.98,0.98-2.57,0-3.56L36.52,42.93c0.54-1.21,1.25-2.32,2.16-3.23c1.08-1.08,2.42-1.87,3.89-2.44   l12.38,12.38c0.49,0.49,1.13,0.74,1.78,0.74c0.64,0,1.29-0.25,1.78-0.74c0.98-0.98,0.98-2.57,0-3.56L48.47,36.04   c1.59-0.12,3.15-0.1,4.57-0.02c2.95,0.17,5.63,0.63,7.45,1.02l2.28,0.66c0.82,0.24,20.07,5.69,29.13-3.37   C92.87,33.35,92.87,31.76,91.89,30.78z",
+    "M64.93,41.75c-1.38,0.12-2.41,1.33-2.29,2.72c0.43,5.04,0.16,11.84-3.59,15.59c-3.51,3.51-9.74,3.94-14.35,3.68   c-3.89-0.22-7.33-0.96-8.9-1.35l-0.9-0.26c-0.81-0.24-20.07-5.69-29.13,3.37c-0.98,0.98-0.98,2.57,0,3.55   c0.49,0.49,1.13,0.74,1.78,0.74c0.64,0,1.29-0.25,1.78-0.74c0.74-0.74,1.6-1.33,2.54-1.82L25.43,80.8   c0.49,0.49,1.13,0.74,1.78,0.74c0.64,0,1.29-0.25,1.78-0.74c0.98-0.98,0.98-2.57,0-3.55L17.34,65.6c2.18-0.31,4.4-0.33,6.34-0.22   c3.89,0.22,7.33,0.96,8.9,1.35l0.9,0.26c0.81,0.24,20.07,5.69,29.13-3.37c4.05-4.05,5.79-10.82,5.05-19.57   C67.53,42.66,66.32,41.63,64.93,41.75z",
+  ],
+  { viewBox: "0 0 100 125", height: "3em", width: "3em" },
 );
diff --git a/src/assets/icons/directory.svg b/src/assets/icons/directory.svg
diff --git a/src/assets/icons/file.svg b/src/assets/icons/file.svg
diff --git a/src/views/FileSystemView.tsx b/src/views/FileSystemView.tsx
@@ -2,6 +2,7 @@ import { open } from "@tauri-apps/plugin-dialog";
 import { type DirEntry, readDir, readTextFile } from "@tauri-apps/plugin-fs";
 import { Button } from "antd";
 import { useEffect, useState } from "react";
+import { DNAIcon } from "../assets/icons";
 import { FilePicker } from "../components/FilePicker";
 
 export default function FileSystemView() {
@@ -84,6 +85,7 @@ export default function FileSystemView() {
   return (
     <div className="flex justify-between border-t border-neutral-200">
       <div className="w-60 border-r border-neutral-200 h-screen p-2">
+        <DNAIcon />
         <p className="text-sm">Files</p>
         <FilePicker entries={sortedEntries} onSelectFile={handlePick} />
         <Button size="small" onClick={handleFileOpen}>