Skip to content

Commit 7e4ae78

Browse files
pa-lempa-lem
authored
Merge pull request #5747 from opsmill/ple-global-activities
Improve node activities and add first draft for global activities
2 parents c61ac59 + 2505db1 commit 7e4ae78

24 files changed

+419
-325
lines changed

‎backend/infrahub/menu/menu.py‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -164,7 +164,7 @@ def _extract_node_icon(model: MainSchemaTypes) -> str:
164164
icon=_extract_node_icon(infrahub_schema.get(InfrahubKind.CHECKDEFINITION)),
165165
protected=True,
166166
section=MenuSection.INTERNAL,
167-
order_weight=3000,
167+
order_weight=2000,
168168
),
169169
MenuItemDefinition(
170170
namespace="Builtin",
@@ -176,6 +176,16 @@ def _extract_node_icon(model: MainSchemaTypes) -> str:
176176
section=MenuSection.INTERNAL,
177177
order_weight=3000,
178178
),
179+
MenuItemDefinition(
180+
namespace="Builtin",
181+
name="ActivityLogs",
182+
label="Activity Logs",
183+
path="/activities",
184+
icon="mdi:format-list-bulleted",
185+
protected=True,
186+
section=MenuSection.INTERNAL,
187+
order_weight=4000,
188+
),
179189
],
180190
),
181191
MenuItemDefinition(

‎frontend/app/src/app/router.tsx‎

Lines changed: 0 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { ARTIFACT_OBJECT, NODE_OBJECT, PROPOSED_CHANGES_OBJECT } from "@/config/constants";
22
import { RequireAuth } from "@/entities/authentication/ui/useAuth";
33
import { BranchesProvider } from "@/entities/branches/ui/branches-provider";
4-
import { INFRAHUB_EVENT } from "@/entities/events/utils/constants";
54
import { constructPathForIpam } from "@/entities/ipam/common/utils";
65
import { IPAM_ROUTE, IP_ADDRESS_GENERIC, IP_PREFIX_GENERIC } from "@/entities/ipam/constants";
76
import { RESOURCE_GENERIC_KIND } from "@/entities/resource-manager/constants";
@@ -90,19 +89,6 @@ export const router = createBrowserRouter([
9089
index: true,
9190
lazy: () => import("@/pages/activities"),
9291
},
93-
{
94-
path: ":activityid",
95-
lazy: () => import("@/pages/activities/details"),
96-
handle: {
97-
breadcrumb: (match: UIMatch) => {
98-
return {
99-
type: "select",
100-
value: match.params.activityid,
101-
kind: INFRAHUB_EVENT,
102-
};
103-
},
104-
},
105-
},
10692
],
10793
},
10894
{

‎frontend/app/src/entities/events/api/get-events-from-api.ts‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
import graphqlClient from "@/shared/api/graphql/graphqlClientApollo";
2+
import { gql } from "@apollo/client";
3+
4+
const EVENTS_QUERY = gql`
5+
query GET_ACTIVITIES($ids: [String!], $offset: Int, $limit: Int) {
6+
InfrahubEvent(related_node__ids: $ids, offset: $offset, limit: $limit) {
7+
count
8+
edges {
9+
node {
10+
id
11+
event
12+
branch
13+
occurred_at
14+
level
15+
account_id
16+
primary_node {
17+
id
18+
kind
19+
}
20+
__typename
21+
... on NodeMutatedEvent {
22+
attributes {
23+
action
24+
kind
25+
name
26+
value
27+
value_previous
28+
}
29+
payload
30+
}
31+
}
32+
}
33+
}
34+
}
35+
`;
36+
37+
export function getEventsFromApi({
38+
ids,
39+
offset,
40+
limit,
41+
search,
42+
branchName,
43+
atDate,
44+
}: {
45+
ids?: Array<string | undefined>;
46+
offset?: number;
47+
limit?: number;
48+
search?: string;
49+
branchName: string;
50+
atDate: Date | null;
51+
}) {
52+
return graphqlClient.query({
53+
query: EVENTS_QUERY,
54+
variables: {
55+
ids,
56+
offset,
57+
limit,
58+
search,
59+
},
60+
context: {
61+
branch: branchName,
62+
date: atDate,
63+
},
64+
});
65+
}

‎frontend/app/src/entities/events/api/get-events.query.ts‎

Lines changed: 32 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,24 +2,51 @@ import { getCurrentBranchName } from "@/entities/branches/domain/get-current-bra
22
import { store } from "@/shared/stores";
33
import { datetimeAtom } from "@/shared/stores/time.atom";
44
import { queryOptions, useQuery } from "@tanstack/react-query";
5-
import { getEventsFromApi } from "./get-events";
5+
import { EventType } from "../ui/event";
6+
import { INFRAHUB_EVENT } from "../utils/constants";
7+
import { getEventsFromApi } from "./get-events-from-api";
68

7-
export function getEventsQueryOptions({ ids }: { ids?: Array<string | undefined> }) {
9+
export function getEventsQueryOptions({
10+
ids,
11+
offset,
12+
limit,
13+
search,
14+
}: { ids?: Array<string | undefined>; offset?: number; limit?: number; search?: string }) {
815
const currentBranchName = getCurrentBranchName();
916
const timeMachineDate = store.get(datetimeAtom);
1017

1118
return queryOptions({
12-
queryKey: ["events", ids],
19+
queryKey: ["events", ids, offset, limit, search],
1320
queryFn: () => {
1421
return getEventsFromApi({
1522
ids,
23+
offset,
24+
limit,
25+
search,
1626
branchName: currentBranchName,
1727
atDate: timeMachineDate,
1828
});
1929
},
2030
});
2131
}
2232

23-
export const useEvents = ({ ids = [] }: { ids?: Array<string | undefined> }) => {
24-
return useQuery(getEventsQueryOptions({ ids }));
33+
export const useEvents = ({
34+
ids = [],
35+
offset,
36+
limit,
37+
search,
38+
}: { ids?: Array<string | undefined>; offset?: number; limit?: number; search?: string }) => {
39+
const { data } = useQuery(getEventsQueryOptions({ ids, offset, limit, search }));
40+
41+
const activities: EventType[] = data?.data?.[INFRAHUB_EVENT]?.edges?.map((edge) => {
42+
return edge.node;
43+
});
44+
45+
const count = data?.data?.[INFRAHUB_EVENT]?.count;
46+
47+
return {
48+
...useQuery(getEventsQueryOptions({ ids, offset, limit, search })),
49+
data: activities,
50+
count,
51+
};
2552
};

‎frontend/app/src/entities/events/api/get-events.ts‎

Lines changed: 0 additions & 54 deletions
This file was deleted.

‎frontend/app/src/entities/events/ui/branch-event.tsx‎

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import { EventNodeInterface } from "@/shared/api/graphql/generated/graphql";
2-
import { DateDisplay } from "@/shared/components/display/date-display";
3-
import { ReactElement } from "react";
2+
import { ReactNode } from "react";
43

5-
export const BRANCH_EVENTS_MAPPING: Record<string, (param: string) => ReactElement> = {
4+
export const BRANCH_EVENTS_MAPPING: Record<string, (param: string) => ReactNode> = {
65
"infrahub.branch.created": (branch) => (
76
<div>
87
Branch <span className="text-black font-semibold">{branch}</span> created
@@ -21,7 +20,7 @@ export const BRANCH_EVENTS_MAPPING: Record<string, (param: string) => ReactEleme
2120
};
2221

2322
export const BranchEvent = (props: EventNodeInterface) => {
24-
const { event, occurred_at, branch } = props;
23+
const { event, branch } = props;
2524

2625
return (
2726
<>
@@ -31,9 +30,6 @@ export const BranchEvent = (props: EventNodeInterface) => {
3130
{branch && BRANCH_EVENTS_MAPPING[event] && BRANCH_EVENTS_MAPPING[event](branch)}
3231
</div>
3332
</div>
34-
<div className="text-xs font-medium text-gray-500 dark:text-neutral-400">
35-
<DateDisplay date={occurred_at} />
36-
</div>
3733
</div>
3834
</>
3935
);

‎frontend/app/src/entities/events/ui/event-details.tsx‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎frontend/app/src/entities/events/ui/event.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export type NodeEventType = NodeMutatedEvent & {
2929

3030
export type EventType = BranchEventType | NodeEventType;
3131

32-
const EventDetails = ({ id, event, occurred_at, account_id, ...props }: EventType) => {
32+
export const EventDetails = ({ id, event, occurred_at, account_id, ...props }: EventType) => {
3333
return (
3434
<div className="divide-y">
3535
<PropertyRow
@@ -57,7 +57,9 @@ export const Event = ({ __typename, ...props }: EventType) => {
5757

5858
<div className="flex flex-grow gap-3 p-2 rounded-md shadow-sm border bg-white">
5959
<div className="flex flex-col gap-2 grow">
60-
{__typename === NODE_MUTATED_EVENT && <NodeEvent {...props} />}
60+
{"attributes" in props && <NodeEvent {...props} />}
61+
62+
{"attributes" in props && <EventAttributes attributes={props.attributes} />}
6163

6264
{BRANCH_EVENTS.includes(__typename) && <BranchEvent {...props} />}
6365

‎frontend/app/src/entities/events/ui/global-branch-event.tsx‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { EventNodeInterface } from "@/shared/api/graphql/generated/graphql";
2+
import { Icon } from "@iconify-icon/react";
3+
import { BRANCH_EVENTS_MAPPING } from "./branch-event";
4+
5+
export const BranchEvent = (props: EventNodeInterface) => {
6+
const { event, branch } = props;
7+
8+
return (
9+
<div className="flex items-center justify-between">
10+
<div className="flex items-center gap-2 text-sm text-gray-500">
11+
<Icon icon="mdi:source-branch" className="text-gray-400" />
12+
13+
{branch && BRANCH_EVENTS_MAPPING[event] && BRANCH_EVENTS_MAPPING[event](branch)}
14+
</div>
15+
</div>
16+
);
17+
};

0 commit comments

Comments
 (0)