Feature/472 (#566)

* feat: update tweet node selected view * feat: change button size * feat: change layer for selected node, fixed minor issues --------- Co-authored-by: Расул <[email protected]> Co-authored-by: kevkevin <[email protected]>
stakwork · Nov 6, 2023 · c4d8b02 · c4d8b02
1 parent 5769cb1
commit c4d8b02
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 15 deletions.
diff --git a/build/index.html b/build/index.html
@@ -22,15 +22,14 @@
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
     <title>Second Brain</title>
-    <script type="module" crossorigin src="/assets/index-8e2e39f2.js"></script>
-    <link rel="stylesheet" href="/assets/index-381991a0.css">
+    <script type="module" crossorigin src="/assets/index-a7fcec29.js"></script>
+    <link rel="stylesheet" href="/assets/index-381991a0.css" />
   </head>
   <body style="background: #000">
     <noscript>You need to enable JavaScript to run this app.</noscript>
     <div id="root"></div>
     <!-- Add entry point 👇 -->
-
-
+
     <!--
       This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.

diff --git a/src/components/App/SideBar/SidebarSubView/index.tsx b/src/components/App/SideBar/SidebarSubView/index.tsx
@@ -3,6 +3,7 @@ import styled from 'styled-components'
 import ChevronLeftIcon from '~/components/Icons/ChevronLeftIcon'
 import CloseIcon from '~/components/Icons/CloseIcon'
 import { Flex } from '~/components/common/Flex'
+import { useAppStore } from '~/stores/useAppStore'
 import { useDataStore } from '~/stores/useDataStore'
 import { colors } from '~/utils/colors'
 import { SelectedNodeView } from '../SelectedNodeView'
@@ -16,6 +17,8 @@ export const SideBarSubView = ({ open }: Props) => {
     s.showTeachMe,
   ])
 
+  const [setSidebarOpen] = useAppStore((s) => [s.setSidebarOpen])
+
   return (
     <Slide direction="right" in={open} mountOnEnter style={{ width: showTeachMe ? '700px' : '' }} unmountOnExit>
       <Wrapper>
@@ -32,8 +35,7 @@ export const SideBarSubView = ({ open }: Props) => {
         </CloseButton>
         <CollapseButton
           onClick={() => {
-            setSelectedNode(null)
-            setTeachMe(false)
+            setSidebarOpen(false)
           }}
         >
           <ChevronLeftIcon />

diff --git a/src/components/SourcesTableModal/SourcesView/Topics/Search/index.tsx b/src/components/SourcesTableModal/SourcesView/Topics/Search/index.tsx
@@ -12,7 +12,10 @@ export const Search = () => {
   const [filters, setFilters] = useTopicsStore((s) => [s.filters, s.setFilters])
   const [inputValue, setInputValue] = useState('')
 
-  const handleSearch = () => setFilters({ search: inputValue })
+  const handleSearch = (e: { preventDefault: () => void }) => {
+    e.preventDefault()
+    setFilters({ search: inputValue })
+  }
 
   const resetSearch = () => {
     setInputValue('')
@@ -23,7 +26,11 @@ export const Search = () => {
   }
 
   return (
-    <Paper component="form" sx={{ p: '2px 4px', display: 'flex', alignItems: 'center', width: 300 }}>
+    <Paper
+      component="form"
+      onSubmit={handleSearch}
+      sx={{ p: '2px 4px', display: 'flex', alignItems: 'center', width: 300 }}
+    >
       <InputBase
         inputProps={{ 'aria-label': 'search topic' }}
         onChange={(e) => setInputValue(e.target.value)}

diff --git a/src/components/Universe/Graph/Cubes/RelevanceBadges/index.tsx b/src/components/Universe/Graph/Cubes/RelevanceBadges/index.tsx
@@ -45,14 +45,14 @@ const NodeBadge = ({ position, userData, color }: BadgeProps) => {
   const isHovered = useMemo(() => hoveredNode?.ref_id === userData?.ref_id, [hoveredNode?.ref_id, userData?.ref_id])
   const isSelected = selectedNode?.ref_id === userData?.ref_id
 
-  return (isSelected && showSelectionGraph) || !isSelected ? (
+  return isTopic || (isSelected && showSelectionGraph) || !isSelected ? (
     <group ref={ref} position={position}>
-      <Html center sprite>
+      <Html center sprite zIndexRange={[0, 0]}>
         <Tag
           className={clsx(userData?.node_type, { selected: isSelected })}
           color={color}
           fontColor={colors.white}
-          fontSize={isTopic ? 14 : 20}
+          fontSize={isTopic ? 64 : 20}
           onClick={(e) => {
             e.stopPropagation()
 

diff --git a/src/components/Universe/Graph/Cubes/Text/index.tsx b/src/components/Universe/Graph/Cubes/Text/index.tsx
@@ -61,7 +61,7 @@ export const TextNode = memo(({ node, hide }: Props) => {
       position={[node.x, node.y, node.z]}
       scale={textScale}
       userData={node}
-      visible={!hide}
+      visible={!hide && !isSelected}
       {...fontProps}
     >
       {node.label}

diff --git a/src/components/Universe/Graph/Cubes/index.tsx b/src/components/Universe/Graph/Cubes/index.tsx
@@ -86,7 +86,7 @@ export const Cubes = memo(() => {
       onPointerOver={onPointerIn}
     >
       <BlurryInstances hide={hideUniverse} />
-
+      <RelevanceBadges />
       {data.nodes
         .filter((f) => {
           const isSelected = f?.ref_id === selectedNode?.ref_id
@@ -103,8 +103,6 @@ export const Cubes = memo(() => {
         })}
 
       {hideUniverse && <SelectionDataNodes />}
-
-      <RelevanceBadges />
     </Select>
   )
 })