Skip to content

Commit e2fbdcf

Browse files
committed
Modify git commit modal [INS-1994] [INS-1475]
1 parent 6a9c541 commit e2fbdcf

18 files changed

Lines changed: 1145 additions & 98 deletions

packages/insomnia/src/common/get-workspace-label.ts

Lines changed: 44 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,49 @@
1-
import { isDesign, isEnvironment, isMcp, isMockServer, type Workspace } from '../models/workspace';
1+
import type { IconProp } from '@fortawesome/fontawesome-svg-core';
2+
3+
import { isDesign, isEnvironment, isMcp, isMockServer, type Workspace, type WorkspaceScope } from '../models/workspace';
24
import { strings } from './strings';
35

6+
export type ProjectScopeKeys = WorkspaceScope | 'unsynced';
7+
8+
export const scopeToLabelMap: Record<
9+
ProjectScopeKeys,
10+
'Document' | 'Collection' | 'Mock Server' | 'Unsynced' | 'Environment' | 'MCP Client'
11+
> = {
12+
'design': 'Document',
13+
'collection': 'Collection',
14+
'mock-server': 'Mock Server',
15+
'unsynced': 'Unsynced',
16+
'environment': 'Environment',
17+
'mcp': 'MCP Client',
18+
};
19+
20+
export const scopeToIconMap: Record<ProjectScopeKeys, IconProp> = {
21+
'design': 'file',
22+
'collection': 'bars',
23+
'mock-server': 'server',
24+
'unsynced': 'cloud-download',
25+
'environment': 'code',
26+
'mcp': ['fac', 'mcp'] as unknown as IconProp,
27+
};
28+
29+
export const scopeToBgColorMap: Record<ProjectScopeKeys, string> = {
30+
'design': 'bg-(--color-info)',
31+
'collection': 'bg-(--color-surprise)',
32+
'mock-server': 'bg-(--color-warning)',
33+
'unsynced': 'bg-(--hl-md)',
34+
'environment': 'bg-(--color-font)',
35+
'mcp': 'bg-(--color-danger)',
36+
};
37+
38+
export const scopeToTextColorMap: Record<ProjectScopeKeys, string> = {
39+
'design': 'text-(--color-font-info)',
40+
'collection': 'text-(--color-font-surprise)',
41+
'mock-server': 'text-(--color-font-warning)',
42+
'unsynced': 'text-(--color-font)',
43+
'environment': 'text-(--color-bg)',
44+
'mcp': 'text-(--color-font-danger)',
45+
};
46+
447
export const getWorkspaceLabel = (workspace: Workspace) => {
548
if (isDesign(workspace)) {
649
return strings.document;

packages/insomnia/src/main/git-service.ts

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2144,16 +2144,22 @@ export const unstageChangesAction = async ({
21442144
}
21452145
};
21462146

2147-
function getPreviewItemName(previewDiffItem: { before: string; after: string }) {
2147+
function getPreviewItemNameAndScope(previewDiffItem: { before: string; after: string }) {
21482148
let prevName = '';
21492149
let nextName = '';
21502150

2151+
let prevScope: WorkspaceScope = 'collection';
2152+
let nextScope: WorkspaceScope = 'collection';
2153+
21512154
try {
21522155
const prev = parse(previewDiffItem.before);
21532156

21542157
if ((prev && 'fileName' in prev) || 'name' in prev) {
21552158
prevName = prev.fileName || prev.name;
21562159
}
2160+
if ('type' in prev) {
2161+
prevScope = insomniaSchemaTypeToScope(prev.type);
2162+
}
21572163
} catch {
21582164
// Nothing to do
21592165
}
@@ -2163,11 +2169,17 @@ function getPreviewItemName(previewDiffItem: { before: string; after: string })
21632169
if ((next && 'fileName' in next) || 'name' in next) {
21642170
nextName = next.fileName || next.name;
21652171
}
2172+
if ('type' in next) {
2173+
nextScope = insomniaSchemaTypeToScope(next.type);
2174+
}
21662175
} catch {
21672176
// Nothing to do
21682177
}
21692178

2170-
return nextName || prevName;
2179+
return {
2180+
name: nextName || prevName,
2181+
scope: nextScope || prevScope,
2182+
};
21712183
}
21722184

21732185
export type GitDiffResult =
@@ -2177,6 +2189,9 @@ export type GitDiffResult =
21772189
before: string;
21782190
after: string;
21792191
};
2192+
filepath: string;
2193+
scope: WorkspaceScope;
2194+
staged: boolean;
21802195
}
21812196
| {
21822197
errors: string[];
@@ -2207,9 +2222,14 @@ export const diffFileLoader = async ({
22072222
after: fileStatus.workdir,
22082223
};
22092224

2225+
const { name, scope } = getPreviewItemNameAndScope(diff);
2226+
22102227
return {
2211-
name: getPreviewItemName(diff) || filepath,
2228+
name: name || filepath,
22122229
diff,
2230+
filepath,
2231+
scope,
2232+
staged,
22132233
};
22142234
} catch (e) {
22152235
const errorMessage = e instanceof Error ? e.message : 'Error while unstaging changes';

packages/insomnia/src/root.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ import { AlertModal } from '~/ui/components/modals/alert-modal';
4141
import { AskModal } from '~/ui/components/modals/ask-modal';
4242
import { ImportModal } from '~/ui/components/modals/import-modal/import-modal';
4343
import { SettingsModal } from '~/ui/components/modals/settings-modal';
44+
import { MonacoHoverTest } from '~/ui/components/monaco-hover-test';
4445
import { Toaster } from '~/ui/components/toast-notification';
4546
import { AppHooks } from '~/ui/containers/app-hooks';
4647
import cssHref from '~/ui/css/styles.css?url';
@@ -558,6 +559,7 @@ const Root = () => {
558559

559560
return (
560561
<>
562+
{/* <MonacoHoverTest /> */}
561563
<div className="app">
562564
<Outlet />
563565
<Toaster />

packages/insomnia/src/routes/organization.$organizationId.project.$projectId._index.tsx

Lines changed: 1 addition & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ import {
3434
getAppWebsiteBaseURL,
3535
} from '~/common/constants';
3636
import { database } from '~/common/database';
37+
import { scopeToBgColorMap, scopeToIconMap, scopeToLabelMap, scopeToTextColorMap } from '~/common/get-workspace-label';
3738
import { fuzzyMatchAll, isNotNullOrUndefined } from '~/common/misc';
3839
import { descendingNumberSort, sortMethodMap } from '~/common/sorting';
3940
import * as models from '~/models';
@@ -85,46 +86,6 @@ import { DEFAULT_STORAGE_RULES } from '~/ui/organization-utils';
8586
import { trackTempProjectOpened } from '~/ui/temp-segment-tracking';
8687
import { invariant } from '~/utils/invariant';
8788

88-
export type ProjectScopeKeys = WorkspaceScope | 'unsynced';
89-
export const scopeToLabelMap: Record<
90-
ProjectScopeKeys,
91-
'Document' | 'Collection' | 'Mock Server' | 'Unsynced' | 'Environment' | 'MCP Client'
92-
> = {
93-
'design': 'Document',
94-
'collection': 'Collection',
95-
'mock-server': 'Mock Server',
96-
'unsynced': 'Unsynced',
97-
'environment': 'Environment',
98-
'mcp': 'MCP Client',
99-
};
100-
101-
export const scopeToIconMap: Record<ProjectScopeKeys, IconProp> = {
102-
'design': 'file',
103-
'collection': 'bars',
104-
'mock-server': 'server',
105-
'unsynced': 'cloud-download',
106-
'environment': 'code',
107-
'mcp': ['fac', 'mcp'] as unknown as IconProp,
108-
};
109-
110-
export const scopeToBgColorMap: Record<ProjectScopeKeys, string> = {
111-
'design': 'bg-(--color-info)',
112-
'collection': 'bg-(--color-surprise)',
113-
'mock-server': 'bg-(--color-warning)',
114-
'unsynced': 'bg-(--hl-md)',
115-
'environment': 'bg-(--color-font)',
116-
'mcp': 'bg-(--color-danger)',
117-
};
118-
119-
export const scopeToTextColorMap: Record<ProjectScopeKeys, string> = {
120-
'design': 'text-(--color-font-info)',
121-
'collection': 'text-(--color-font-surprise)',
122-
'mock-server': 'text-(--color-font-warning)',
123-
'unsynced': 'text-(--color-font)',
124-
'environment': 'text-(--color-bg)',
125-
'mcp': 'text-(--color-font-danger)',
126-
};
127-
12889
export interface InsomniaFile {
12990
id: string;
13091
name: string;

packages/insomnia/src/routes/organization.$organizationId.project.$projectId.list-workspaces.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { href } from 'react-router';
22

33
import { parseApiSpec, type ParsedApiSpec } from '~/common/api-specs';
44
import { database } from '~/common/database';
5+
import { scopeToLabelMap } from '~/common/get-workspace-label';
56
import { isNotNullOrUndefined } from '~/common/misc';
67
import { descendingNumberSort } from '~/common/sorting';
78
import * as models from '~/models';
@@ -16,7 +17,7 @@ import { invariant } from '~/utils/invariant';
1617
import { createFetcherLoadHook } from '~/utils/router';
1718

1819
import type { Route } from './+types/organization.$organizationId.project.$projectId.list-workspaces';
19-
import { type InsomniaFile, scopeToLabelMap } from './organization.$organizationId.project.$projectId._index';
20+
import { type InsomniaFile } from './organization.$organizationId.project.$projectId._index';
2021

2122
async function getAllLocalFiles({ projectId }: { projectId: string }) {
2223
const projectWorkspaces = await models.workspace.findByParentId(projectId);

packages/insomnia/src/ui/components/command-palette.tsx

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import {
2020
} from 'react-aria-components';
2121
import { href, useNavigate, useParams } from 'react-router';
2222

23+
import { scopeToBgColorMap, scopeToIconMap, scopeToLabelMap, scopeToTextColorMap } from '~/common/get-workspace-label';
2324
import { constructKeyCombinationDisplay, getPlatformKeyCombinations } from '~/common/hotkeys';
2425
import { fuzzyMatch } from '~/common/misc';
2526
import { mcpRequest } from '~/models';
@@ -30,12 +31,6 @@ import { isWebSocketRequest } from '~/models/websocket-request';
3031
import { useRootLoaderData } from '~/root';
3132
import { useCommandsLoaderFetcher } from '~/routes/commands';
3233
import { useInsomniaSyncPullRemoteFileActionFetcher } from '~/routes/organization.$organizationId.insomnia-sync.pull-remote-file';
33-
import {
34-
scopeToBgColorMap,
35-
scopeToIconMap,
36-
scopeToLabelMap,
37-
scopeToTextColorMap,
38-
} from '~/routes/organization.$organizationId.project.$projectId._index';
3934
import { useSetActiveEnvironmentFetcher } from '~/routes/organization.$organizationId.project.$projectId.workspace.$workspaceId.environment.set-active';
4035
import { useRemoteFilesLoaderFetcher } from '~/routes/remote-files';
4136
import { AvatarGroup } from '~/ui/components/avatar';

packages/insomnia/src/ui/components/diff-view-editor.tsx

Lines changed: 50 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { useEffect, useRef } from 'react';
22
import { parseColor } from 'react-aria-components';
33

44
import { useRootLoaderData } from '~/root';
5+
import { useIsLightTheme } from '~/ui/hooks/theme';
56

67
import { monaco } from './monaco.client';
78

@@ -14,6 +15,9 @@ export const DiffEditor = ({ original, modified }: { original: string; modified:
1415
modified?: monaco.editor.ITextModel;
1516
}>({});
1617

18+
const isLightTheme = useIsLightTheme();
19+
const isLightThemeRef = useRef(isLightTheme);
20+
1721
const { settings } = useRootLoaderData()!;
1822

1923
// 1) Define theme when settings change
@@ -63,7 +67,7 @@ export const DiffEditor = ({ original, modified }: { original: string; modified:
6367
});
6468

6569
// Apply theme (global)
66-
monaco.editor.setTheme('insomnia');
70+
// monaco.editor.setTheme('insomnia');
6771

6872
// Re-layout if editor exists
6973
editorRef.current?.layout(undefined, true);
@@ -78,17 +82,29 @@ export const DiffEditor = ({ original, modified }: { original: string; modified:
7882
renderSideBySide: true,
7983
useInlineViewWhenSpaceIsLimited: true,
8084
readOnly: true,
81-
lineNumbers: 'off',
8285
scrollBeyondLastLine: false,
8386
automaticLayout: true,
8487
contextmenu: false,
8588
minimap: { enabled: false },
89+
hideUnchangedRegions: {
90+
enabled: true,
91+
contextLineCount: 3,
92+
minimumLineCount: 3,
93+
revealLineCount: 20,
94+
},
95+
96+
// You can optionally disable the resizing
97+
enableSplitViewResizing: false,
98+
// Additional options for better testing experience
99+
theme: isLightThemeRef.current ? 'vs' : 'vs-dark',
100+
// Enable glyph margin for both editors
101+
glyphMargin: true,
86102
});
87103

88104
editorRef.current = diffEditor;
89105

90106
// Make sure theme vars are applied
91-
monaco.editor.setTheme('insomnia');
107+
// monaco.editor.setTheme('vs-dark');
92108

93109
// Layout next frame (helps in Electron)
94110
requestAnimationFrame(() => diffEditor.layout(undefined, true));
@@ -143,8 +159,38 @@ export const DiffEditor = ({ original, modified }: { original: string; modified:
143159
});
144160

145161
// Re-apply theme vars + layout (cheap)
146-
monaco.editor.setTheme('insomnia');
162+
// monaco.editor.setTheme('insomnia');
147163
diffEditor.layout(undefined, true);
164+
165+
setTimeout(() => {
166+
const diffEditor = editorRef.current;
167+
if (!diffEditor) return;
168+
const originalEditor = diffEditor.getOriginalEditor();
169+
const modifiedEditor = diffEditor.getModifiedEditor();
170+
console.log('Adding decorations to main editor');
171+
originalEditor.createDecorationsCollection([
172+
{
173+
range: new monaco.Range(41, 1, 41, 20),
174+
options: {
175+
glyphMarginClassName: 'info-decoration',
176+
hoverMessage: [{ value: `**Main Editor Info**` }, { value: 'Main editor hover message' }],
177+
isWholeLine: true,
178+
showIfCollapsed: true,
179+
},
180+
},
181+
]);
182+
modifiedEditor.createDecorationsCollection([
183+
{
184+
range: new monaco.Range(41, 1, 41, 20),
185+
options: {
186+
glyphMarginClassName: 'info-decoration',
187+
hoverMessage: [{ value: `**Main Editor Info**` }, { value: 'Main editor hover message' }],
188+
isWholeLine: true,
189+
showIfCollapsed: true,
190+
},
191+
},
192+
]);
193+
}, 500);
148194
}, [original, modified]);
149195

150196
return <div className="h-full w-full" ref={monacoEl} />;

packages/insomnia/src/ui/components/dropdowns/git-project-sync-dropdown.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ export const GitProjectSyncDropdown: FC<Props> = ({ gitRepository, activeProject
5454

5555
const [isGitBranchesModalOpen, setIsGitBranchesModalOpen] = useState(false);
5656
const [isGitLogModalOpen, setIsGitLogModalOpen] = useState(false);
57-
const [isGitStagingModalOpen, setIsGitStagingModalOpen] = useState(false);
57+
const [isGitStagingModalOpen, setIsGitStagingModalOpen] = useState(true);
5858
const [isGitPullRequiredModalOpen, setIsGitPullRequiredModalOpen] = useState(false);
5959
const [stagingMode, setStagingMode] = useState<StagingModalMode>(StagingModalModes.default);
6060
const [isMigrationModalOpen, setIsMigrationModalOpen] = useState(false);

packages/insomnia/src/ui/components/modals/git-project-migration-modal.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,13 +16,13 @@ import { useParams } from 'react-router';
1616

1717
import { useGitProjectMigrateLegacyInsomniaFolderActionFetcher } from '~/routes/git.migrate-legacy-insomnia-folder-to-file';
1818

19-
import type { WorkspaceScope } from '../../../models/workspace';
2019
import {
2120
scopeToBgColorMap,
2221
scopeToIconMap,
2322
scopeToLabelMap,
2423
scopeToTextColorMap,
25-
} from '../../../routes/organization.$organizationId.project.$projectId._index';
24+
} from '../../../common/get-workspace-label';
25+
import type { WorkspaceScope } from '../../../models/workspace';
2626
import { Icon } from '../icon';
2727

2828
export const GitProjectMigrationModal: FC<{

0 commit comments

Comments
 (0)