frishi/threetwo
1
0
Fork 0
Code Issues 9 Pull Requests 6 Actions Packages Projects Releases 2 Wiki Activity

🔧 Fixed object orchestration for volumes in UI

Browse Source
This commit is contained in:
Rishi Ghan
2022-03-04 15:43:27 -08:00
parent 103cc7fa91
commit cf167be8da
1 changed files with 20 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/client/components/Dashboard/VolumeGroups.tsx
View File

@@ -1,4 +1,4 @@
import { map } from "lodash";
import { map, unionBy } from "lodash";
import React, { ReactElement } from "react";
import ellipsize from "ellipsize";
import { Link } from "react-router-dom";
@@ -11,6 +11,8 @@ export const VolumeGroups = (props): ReactElement => {
700: 2,
500: 1,
};
// Till mongo gives us back the deduplicated results with the ObjectId
const deduplicatedGroups = unionBy(props.volumeGroups, "volumes.id");
return (
<section className="volumes-container mt-4">
<div className="content">
@@ -22,29 +24,25 @@ export const VolumeGroups = (props): ReactElement => {
className="volumes-grid"
columnClassName="volumes-grid-column"
>
{map(props.volumeGroups, (data) => {
return map(data.data, (group) => {
return (
<div className="stack" key={group.id}>
<img src={group.volume.image.small_url} />
<div className="content">
<div className="stack-title is-size-8">
<Link to={`/volume/details/${group.id}`}>
{ellipsize(group.volume.name, 18)}
</Link>
</div>
<div className="control">
<span className="tags has-addons">
<span className="tag is-primary is-light">Issues</span>
<span className="tag">
{group.volume.count_of_issues}
</span>
</span>
</div>
{map(deduplicatedGroups, (data) => {
return (
<div className="stack" key={data._id}>
<img src={data.volumes.image.small_url} />
<div className="content">
<div className="stack-title is-size-8">
<Link to={`/volume/details/${data._id}`}>
{ellipsize(data.volumes.name, 18)}
</Link>
</div>
<div className="control">
<span className="tags has-addons">
<span className="tag is-primary is-light">Issues</span>
<span className="tag">{data.volumes.count_of_issues}</span>
</span>
</div>
</div>
);
});
</div>
);
})}
</Masonry>
</section>