Skip to content

Commit 8944671

Browse files
refactor: create custom sandboxByPath fragment to reduce query payload (#8830)
* refactor: remove irrelevant fields from query and fix type errors * fix: recover Stats component * fix: runtime and typechecks for potentially undefined properties * chore: rename fragment to not include fragment twice * fix(dashboard): use type guard instead of type assertion in search items filter * fix(dashboard): support filtering deleted sandboxes with reduced field set * fix: handle null/undefined fields for deleted sandboxes * refactor: create custom sandboxByPath fragment to reduce query payload * refactor: create custom draftSandbox fragment to reduce query payload (#8831)
1 parent ef14197 commit 8944671

File tree

10 files changed

+222
-41
lines changed

10 files changed

+222
-41
lines changed

packages/app/src/app/graphql/types.ts

Lines changed: 89 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -4678,6 +4678,45 @@ export type RecentlyDeletedTeamSandboxesQuery = {
46784678
} | null;
46794679
};
46804680

4681+
export type SandboxByPathFragment = {
4682+
__typename?: 'Sandbox';
4683+
id: string;
4684+
alias: string | null;
4685+
title: string | null;
4686+
insertedAt: string;
4687+
updatedAt: string;
4688+
screenshotUrl: string | null;
4689+
isV2: boolean;
4690+
isFrozen: boolean;
4691+
privacy: number;
4692+
restricted: boolean;
4693+
draft: boolean;
4694+
viewCount: number;
4695+
teamId: any | null;
4696+
source: { __typename?: 'Source'; template: string | null };
4697+
customTemplate: {
4698+
__typename?: 'Template';
4699+
id: any | null;
4700+
iconUrl: string | null;
4701+
} | null;
4702+
forkedTemplate: {
4703+
__typename?: 'Template';
4704+
id: any | null;
4705+
iconUrl: string | null;
4706+
} | null;
4707+
collection: {
4708+
__typename?: 'Collection';
4709+
path: string;
4710+
id: any | null;
4711+
} | null;
4712+
author: { __typename?: 'User'; username: string } | null;
4713+
permissions: {
4714+
__typename?: 'SandboxProtectionSettings';
4715+
preventSandboxLeaving: boolean;
4716+
preventSandboxExport: boolean;
4717+
} | null;
4718+
};
4719+
46814720
export type SandboxesByPathQueryVariables = Exact<{
46824721
path: Scalars['String'];
46834722
teamId: InputMaybe<Scalars['ID']>;
@@ -4703,20 +4742,15 @@ export type SandboxesByPathQuery = {
47034742
id: string;
47044743
alias: string | null;
47054744
title: string | null;
4706-
description: string | null;
4707-
lastAccessedAt: any;
47084745
insertedAt: string;
47094746
updatedAt: string;
4710-
removedAt: string | null;
4711-
privacy: number;
4712-
isFrozen: boolean;
47134747
screenshotUrl: string | null;
4714-
viewCount: number;
4715-
likeCount: number;
47164748
isV2: boolean;
4717-
draft: boolean;
4749+
isFrozen: boolean;
4750+
privacy: number;
47184751
restricted: boolean;
4719-
authorId: any | null;
4752+
draft: boolean;
4753+
viewCount: number;
47204754
teamId: any | null;
47214755
source: { __typename?: 'Source'; template: string | null };
47224756
customTemplate: {
@@ -4727,7 +4761,6 @@ export type SandboxesByPathQuery = {
47274761
forkedTemplate: {
47284762
__typename?: 'Template';
47294763
id: any | null;
4730-
color: string | null;
47314764
iconUrl: string | null;
47324765
} | null;
47334766
collection: {
@@ -4746,6 +4779,47 @@ export type SandboxesByPathQuery = {
47464779
} | null;
47474780
};
47484781

4782+
export type DraftSandboxFragment = {
4783+
__typename?: 'Sandbox';
4784+
id: string;
4785+
alias: string | null;
4786+
title: string | null;
4787+
insertedAt: string;
4788+
updatedAt: string;
4789+
screenshotUrl: string | null;
4790+
isV2: boolean;
4791+
isFrozen: boolean;
4792+
privacy: number;
4793+
restricted: boolean;
4794+
draft: boolean;
4795+
viewCount: number;
4796+
authorId: any | null;
4797+
lastAccessedAt: any;
4798+
teamId: any | null;
4799+
source: { __typename?: 'Source'; template: string | null };
4800+
customTemplate: {
4801+
__typename?: 'Template';
4802+
id: any | null;
4803+
iconUrl: string | null;
4804+
} | null;
4805+
forkedTemplate: {
4806+
__typename?: 'Template';
4807+
id: any | null;
4808+
iconUrl: string | null;
4809+
} | null;
4810+
collection: {
4811+
__typename?: 'Collection';
4812+
path: string;
4813+
id: any | null;
4814+
} | null;
4815+
author: { __typename?: 'User'; username: string } | null;
4816+
permissions: {
4817+
__typename?: 'SandboxProtectionSettings';
4818+
preventSandboxLeaving: boolean;
4819+
preventSandboxExport: boolean;
4820+
} | null;
4821+
};
4822+
47494823
export type TeamDraftsQueryVariables = Exact<{
47504824
teamId: Scalars['UUID4'];
47514825
authorId: InputMaybe<Scalars['UUID4']>;
@@ -4763,20 +4837,17 @@ export type TeamDraftsQuery = {
47634837
id: string;
47644838
alias: string | null;
47654839
title: string | null;
4766-
description: string | null;
4767-
lastAccessedAt: any;
47684840
insertedAt: string;
47694841
updatedAt: string;
4770-
removedAt: string | null;
4771-
privacy: number;
4772-
isFrozen: boolean;
47734842
screenshotUrl: string | null;
4774-
viewCount: number;
4775-
likeCount: number;
47764843
isV2: boolean;
4777-
draft: boolean;
4844+
isFrozen: boolean;
4845+
privacy: number;
47784846
restricted: boolean;
4847+
draft: boolean;
4848+
viewCount: number;
47794849
authorId: any | null;
4850+
lastAccessedAt: any;
47804851
teamId: any | null;
47814852
source: { __typename?: 'Source'; template: string | null };
47824853
customTemplate: {
@@ -4787,7 +4858,6 @@ export type TeamDraftsQuery = {
47874858
forkedTemplate: {
47884859
__typename?: 'Template';
47894860
id: any | null;
4790-
color: string | null;
47914861
iconUrl: string | null;
47924862
} | null;
47934863
collection: {

packages/app/src/app/overmind/effects/gql/dashboard/queries.ts

Lines changed: 98 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,52 @@ export const deletedTeamSandboxes: Query<
9898
${RECENTLY_DELETED_TEAM_SANDBOXES_FRAGMENT}
9999
`;
100100

101+
const SANDBOX_BY_PATH_FRAGMENT = gql`
102+
fragment sandboxByPath on Sandbox {
103+
id
104+
alias
105+
title
106+
insertedAt
107+
updatedAt
108+
screenshotUrl
109+
isV2
110+
isFrozen
111+
privacy
112+
restricted
113+
draft
114+
viewCount
115+
116+
source {
117+
template
118+
}
119+
120+
customTemplate {
121+
id
122+
iconUrl
123+
}
124+
125+
forkedTemplate {
126+
id
127+
iconUrl
128+
}
129+
130+
collection {
131+
path
132+
id
133+
}
134+
135+
author {
136+
username
137+
}
138+
teamId
139+
140+
permissions {
141+
preventSandboxLeaving
142+
preventSandboxExport
143+
}
144+
}
145+
`;
146+
101147
export const sandboxesByPath: Query<
102148
SandboxesByPathQuery,
103149
SandboxesByPathQueryVariables
@@ -113,15 +159,63 @@ export const sandboxesByPath: Query<
113159
id
114160
path
115161
sandboxes {
116-
...sandboxFragmentDashboard
162+
...sandboxByPath
117163
}
118164
}
119165
}
120166
}
121-
${sandboxFragmentDashboard}
167+
${SANDBOX_BY_PATH_FRAGMENT}
122168
${sidebarCollectionDashboard}
123169
`;
124170

171+
const DRAFT_SANDBOX_FRAGMENT = gql`
172+
fragment draftSandbox on Sandbox {
173+
id
174+
alias
175+
title
176+
insertedAt
177+
updatedAt
178+
screenshotUrl
179+
isV2
180+
isFrozen
181+
privacy
182+
restricted
183+
draft
184+
viewCount
185+
authorId
186+
lastAccessedAt
187+
188+
source {
189+
template
190+
}
191+
192+
customTemplate {
193+
id
194+
iconUrl
195+
}
196+
197+
forkedTemplate {
198+
id
199+
iconUrl
200+
}
201+
202+
collection {
203+
path
204+
id
205+
}
206+
207+
author {
208+
username
209+
}
210+
teamId
211+
212+
permissions {
213+
preventSandboxLeaving
214+
preventSandboxExport
215+
}
216+
}
217+
`;
218+
125219
export const getTeamDrafts: Query<
126220
TeamDraftsQuery,
127221
TeamDraftsQueryVariables
@@ -132,12 +226,12 @@ export const getTeamDrafts: Query<
132226
133227
team(id: $teamId) {
134228
drafts(authorId: $authorId) {
135-
...sandboxFragmentDashboard
229+
...draftSandbox
136230
}
137231
}
138232
}
139233
}
140-
${sandboxFragmentDashboard}
234+
${DRAFT_SANDBOX_FRAGMENT}
141235
`;
142236

143237
export const getCollections: Query<

packages/app/src/app/overmind/namespaces/dashboard/actions.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { uniq } from 'lodash-es';
66
import {
77
TemplateFragmentDashboardFragment,
88
SandboxFragmentDashboardFragment,
9+
DraftSandboxFragment,
910
RepoFragmentDashboardFragment,
1011
ProjectFragment,
1112
} from 'app/graphql/types';
@@ -192,7 +193,7 @@ export const createFolder = async (
192193
export const getDrafts = async ({ state, effects }: Context) => {
193194
const { dashboard, activeTeam } = state;
194195
try {
195-
let sandboxes: SandboxFragmentDashboardFragment[] = [];
196+
let sandboxes: (SandboxFragmentDashboardFragment | DraftSandboxFragment)[] = [];
196197

197198
if (activeTeam) {
198199
const data = await effects.gql.queries.getTeamDrafts({

packages/app/src/app/overmind/namespaces/dashboard/internalActions.ts

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,9 @@
11
import { Context } from 'app/overmind';
2-
import { SandboxFragmentDashboardFragment } from 'app/graphql/types';
2+
import {
3+
SandboxFragmentDashboardFragment,
4+
SandboxByPathFragment,
5+
DraftSandboxFragment,
6+
} from 'app/graphql/types';
37

48
/**
59
* Change sandbox frozen in state and returns the sandboxes that have changed in their old state
@@ -15,14 +19,14 @@ export const changeSandboxesInState = (
1519
* The mutation that happens on the sandbox, make sure to return a *new* sandbox here, to make sure
1620
* that we can still rollback easily in the future.
1721
*/
18-
sandboxMutation: <T extends SandboxFragmentDashboardFragment>(
22+
sandboxMutation: <T extends SandboxFragmentDashboardFragment | SandboxByPathFragment | DraftSandboxFragment>(
1923
sandbox: T
2024
) => T;
2125
}
2226
) => {
2327
const changedSandboxes: Set<ReturnType<typeof sandboxMutation>> = new Set();
2428

25-
const doMutateSandbox = <T extends SandboxFragmentDashboardFragment>(
29+
const doMutateSandbox = <T extends SandboxFragmentDashboardFragment | SandboxByPathFragment | DraftSandboxFragment>(
2630
sandbox: T
2731
): T => {
2832
changedSandboxes.add(sandbox);
@@ -106,7 +110,7 @@ export const deleteSandboxesFromState = (
106110
ids: string[];
107111
}
108112
) => {
109-
const sandboxFilter = <T extends SandboxFragmentDashboardFragment>(
113+
const sandboxFilter = <T extends SandboxFragmentDashboardFragment | SandboxByPathFragment | DraftSandboxFragment>(
110114
sandbox: T
111115
): boolean => !ids.includes(sandbox.id);
112116

packages/app/src/app/overmind/namespaces/dashboard/state.ts

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import {
22
SandboxFragmentDashboardFragment as Sandbox,
3+
SandboxByPathFragment,
4+
DraftSandboxFragment,
35
RepoFragmentDashboardFragment as Repo,
46
TemplateFragmentDashboardFragment as Template,
57
TeamFragmentDashboardFragment,
@@ -16,16 +18,16 @@ import { derived } from 'overmind';
1618
import { DELETE_ME_COLLECTION, OrderBy } from './types';
1719

1820
export type DashboardSandboxStructure = {
19-
DRAFTS: Sandbox[] | null;
21+
DRAFTS: DraftSandboxFragment[] | null;
2022
TEMPLATES: Template[] | null;
2123
DELETED: RecentlyDeletedTeamSandboxesFragment[] | null;
22-
RECENT_SANDBOXES: Sandbox[] | null;
24+
RECENT_SANDBOXES: (Sandbox | DraftSandboxFragment)[] | null;
2325
RECENT_BRANCHES: Branch[] | null;
24-
SEARCH: Sandbox[] | null;
26+
SEARCH: (Sandbox | DraftSandboxFragment)[] | null;
2527
TEMPLATE_HOME: Template[] | null;
26-
SHARED: Sandbox[] | null;
28+
SHARED: (Sandbox | DraftSandboxFragment)[] | null;
2729
ALL: {
28-
[path: string]: Sandbox[];
30+
[path: string]: (Sandbox | SandboxByPathFragment | DraftSandboxFragment)[];
2931
} | null;
3032
REPOS: {
3133
[path: string]: {
@@ -48,7 +50,7 @@ export type State = {
4850
viewMode: 'grid' | 'list';
4951
orderBy: OrderBy;
5052
getFilteredSandboxes: (
51-
sandboxes: Array<Sandbox | RecentlyDeletedTeamSandboxesFragment | Repo | Template['sandbox']>
53+
sandboxes: Array<Sandbox | SandboxByPathFragment | RecentlyDeletedTeamSandboxesFragment | Repo | Template['sandbox']>
5254
) => Sandbox[];
5355
deletedSandboxesByTime: {
5456
week: RecentlyDeletedTeamSandboxesFragment[];
@@ -137,7 +139,7 @@ export const state: State = {
137139
},
138140
getFilteredSandboxes: derived(
139141
({ orderBy }: State) => (
140-
sandboxes: Array<Sandbox | RecentlyDeletedTeamSandboxesFragment | Template['sandbox']>
142+
sandboxes: Array<Sandbox | SandboxByPathFragment | DraftSandboxFragment | RecentlyDeletedTeamSandboxesFragment | Template['sandbox']>
141143
) => {
142144
const orderField = orderBy.field;
143145
const orderOrder = orderBy.order;

0 commit comments

Comments
 (0)