Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Specific Actions to Repository Node Type #2404

Merged
merged 3 commits into from
Nov 1, 2024
Merged

Add Specific Actions to Repository Node Type #2404

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
7205204
fix(ui): add specific UI actions for Repository node type
aliraza556 Oct 29, 2024
9536a43
fix(edges-dropdown): dropdown spacing and edge white marks
aliraza556 Oct 30, 2024
b96b9bf
fix(generate-test): icon
aliraza556 Oct 30, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
101 changes: 83 additions & 18 deletions src/components/Universe/Graph/UI/NodeControls/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,13 @@ import styled from 'styled-components'
import { Group, Vector3 } from 'three'
import { useGraphData } from '~/components/DataRetriever'
import AddCircleIcon from '~/components/Icons/AddCircleIcon'
import ConstructionIcon from '~/components/Icons/ConstructionIcon'
import DocumentIcon from '~/components/Icons/DocumentIcon'
import EditIcon from '~/components/Icons/EditIcon'
import MergeIcon from '~/components/Icons/MergeIcon'
import NodesIcon from '~/components/Icons/NodesIcon'
import PlusIcon from '~/components/Icons/PlusIcon'
import RobotIcon from '~/components/Icons/RobotIcon'
import { Flex } from '~/components/common/Flex'
import { fetchNodeEdges } from '~/network/fetchGraphData'
import { useAppStore } from '~/stores/useAppStore'
Expand Down Expand Up @@ -164,6 +167,8 @@ export const NodeControls = memo(() => {

const id = open ? 'simple-popover' : undefined

const isRepository = selectedNode?.node_type?.toLowerCase() === 'repository'

const isShowCreateTestButton = !!(selectedNode && selectedNode?.node_type?.toLowerCase() === 'function')

return (
Expand Down Expand Up @@ -216,24 +221,70 @@ export const NodeControls = memo(() => {
open={open}
transformOrigin={{ vertical: 'top', horizontal: 'right' }}
>
<PopoverOption
data-testid="merge"
onClick={() => {
mergeTopicModal()
handleClose()
}}
>
<MergeIcon data-testid="MergeIcon" /> Merge
</PopoverOption>
<PopoverOption
data-testid="add_edge"
onClick={() => {
addEdgeToNodeModal()
handleClose()
}}
>
<AddCircleIcon data-testid="AddCircleIcon" /> Add edge
</PopoverOption>
{!isRepository ? (
<>
<PopoverOption
data-testid="merge"
onClick={() => {
mergeTopicModal()
handleClose()
}}
>
<MergeIcon data-testid="MergeIcon" /> Merge
</PopoverOption>
<PopoverOption
data-testid="add_edge"
onClick={() => {
addEdgeToNodeModal()
handleClose()
}}
>
<AddCircleIcon data-testid="AddCircleIcon" />
Add edge
</PopoverOption>
</>
) : (
<>
<PopoverOption
data-testid="generate_tests"
onClick={() => {
handleClose()
}}
>
<IconWrapper>
<AddCircleIcon data-testid="AddCircleIcon" />
</IconWrapper>
Generate Tests
</PopoverOption>
<PopoverOption
data-testid="add_comments"
onClick={() => {
handleClose()
}}
>
<IconWrapper>
<DocumentIcon data-testid="DocumentIcon" />{' '}
</IconWrapper>
Add Comments
</PopoverOption>
<PopoverOption
data-testid="review_bugs"
onClick={() => {
handleClose()
}}
>
<ConstructionIcon data-testid="ConstructionIcon" /> Review Bugs
</PopoverOption>
<PopoverOption
data-testid="find_vulnerabilities"
onClick={() => {
handleClose()
}}
>
<RobotIcon data-testid="RobotIcon" /> Find Vulnerabilities
</PopoverOption>
</>
)}
</PopoverWrapper>
</Html>
</group>
Expand Down Expand Up @@ -301,6 +352,20 @@ const PopoverWrapper = styled(Popover)`
font-family: Barlow;
font-size: 14px;
font-weight: 500;
background-color: transparent !important;
margin: 2px;
}
`

const IconWrapper = styled.div`
display: flex;
align-items: center;
justify-content: start;

svg {
margin-top: 1px;
width: 12px;
height: 12px;
}
`

Expand Down
Loading