diff options
Diffstat (limited to 'extension/src/components/FolderButton.tsx')
| -rw-r--r-- | extension/src/components/FolderButton.tsx | 25 |
1 files changed, 14 insertions, 11 deletions
diff --git a/extension/src/components/FolderButton.tsx b/extension/src/components/FolderButton.tsx index 42e5d60..2b59d56 100644 --- a/extension/src/components/FolderButton.tsx +++ b/extension/src/components/FolderButton.tsx @@ -1,8 +1,9 @@ import BookmarkTreeNode = browser.bookmarks.BookmarkTreeNode; import FolderBody from "./FolderBody.tsx"; -import folderIcon from "../assets/folder.svg" -import folderIconOpen from "../assets/folder_open.svg" +import FolderIcon from "../assets/folder.svg?react" +import FolderIconOpen from "../assets/folder_open.svg?react" import {useState} from "react"; +import bookmark from "./Bookmark.tsx"; /** * A component for the button used to open a bookmark folder. @@ -15,16 +16,18 @@ function FolderButton(props: {data: BookmarkTreeNode}) { return( <> - <a className="bookmark draggable" onClick={() => setFolderOpen(!folderOpen)}> - <div className="icon-box"> - <img alt="Folder icon" src={folderOpen ? folderIconOpen : folderIcon}/> - </div> - <span>{props.data.title}</span> - </a> + <div className={"bookmark"}> + <a onClick={() => setFolderOpen(!folderOpen)}> + <div className="icon-box"> + {folderOpen ? <FolderIconOpen/> : <FolderIcon/>} + </div> + <span>{props.data.title}</span> + </a> + </div> {folderOpen - && props.data.children - && props.data.children.length > 0 - && (<FolderBody data={props.data}/>)} + && props.data.children + && props.data.children.length > 0 + && (<FolderBody data={props.data}/>)} </> ); } |