Skip to content

revamped the connection layout and added the cluster grouping#68

Merged
nassery318 merged 4 commits intovalkey-io:mainfrom
nassery318:improving-the-connection-layout
Nov 13, 2025
Merged

revamped the connection layout and added the cluster grouping#68
nassery318 merged 4 commits intovalkey-io:mainfrom
nassery318:improving-the-connection-layout

Conversation

@nassery318
Copy link
Copy Markdown
Contributor

No description provided.

@@ -0,0 +1,111 @@
import { useState, useRef, useEffect } from "react"
import { CONNECTED } from "@common/src/constants.ts"
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

won't this fail the linter because of the imports order? it should be below lucide-react

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This in not effecting the linter, but I still organized it in the new commit.

const hasConnectedInstance = connections.some(({ connection }) => connection.status === CONNECTED)
const connectedCount = connections.filter(({ connection }) => connection.status === CONNECTED).length

const firstConnectedConnection = connections.find(({ connection }) => connection.status === CONNECTED)
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

while the impact is very minor, we can still iterate over connections only once

const connected = connections.filter(({ connection }) => connection.status === CONNECTED)
const connectedCount = connected.length
const hasConnectedInstance = connectedCount > 0
const firstConnectedConnection = connected[0]

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Adressed.

Signed-off-by: nassery318 <nassery318@gmail.com>
}>(
(acc, [connectionId, connection]) => {
const clusterId = connection.connectionDetails.clusterId
if (clusterId) {
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

maybe using nullish coalescing assignment operator can improve readbility here

if (clusterId)
  (acc.clusterGroups[clusterId] ??= []).push({ connectionId, connection })
else
  acc.standaloneConnections.push({ connectionId, connection })

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Adressed

Signed-off-by: nassery318 <nassery318@gmail.com>
@nassery318 nassery318 merged commit c31ae86 into valkey-io:main Nov 13, 2025
1 of 2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants