formatting fixes - batch 1

This commit is contained in:
Siddharth Gelera
2025-09-18 15:45:31 +05:30
parent 1a33f2e83f
commit ee3543535d
3 changed files with 99 additions and 94 deletions

View File

@@ -2,17 +2,17 @@ import React from 'react';
// UNARY - Single request, single response (Blue)
export const IconGrpcUnary = ({ size = 18, strokeWidth = 1.5, className = '' }) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
strokeLinecap="round"
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
strokeLinecap="round"
strokeLinejoin="round"
className={className}
>
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
{/* Request arrow (top) - right */}
<path d="M3 8h18" stroke="#3B82F6" strokeWidth={strokeWidth} />
<path d="M18 5l3 3l-3 3" stroke="#3B82F6" strokeWidth={strokeWidth} />
@@ -24,17 +24,17 @@ export const IconGrpcUnary = ({ size = 18, strokeWidth = 1.5, className = '' })
// CLIENT_STREAMING - Streaming request, single response (Purple)
export const IconGrpcClientStreaming = ({ size = 18, strokeWidth = 1.5, className = '' }) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
strokeLinecap="round"
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
strokeLinecap="round"
strokeLinejoin="round"
className={className}
>
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
{/* Request arrow (top) - right with double heads */}
<path d="M3 8h18" stroke="#8B5CF6" strokeWidth={strokeWidth} />
<path d="M18 5l3 3l-3 3" stroke="#8B5CF6" strokeWidth={strokeWidth} />
@@ -47,17 +47,17 @@ export const IconGrpcClientStreaming = ({ size = 18, strokeWidth = 1.5, classNam
// SERVER_STREAMING - Single request, streaming response (Green)
export const IconGrpcServerStreaming = ({ size = 18, strokeWidth = 1.5, className = '' }) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
strokeLinecap="round"
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
strokeLinecap="round"
strokeLinejoin="round"
className={className}
>
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
{/* Request arrow (top) - right */}
<path d="M3 8h18" stroke="#10B981" strokeWidth={strokeWidth} />
<path d="M18 5l3 3l-3 3" stroke="#10B981" strokeWidth={strokeWidth} />
@@ -70,17 +70,17 @@ export const IconGrpcServerStreaming = ({ size = 18, strokeWidth = 1.5, classNam
// BIDI_STREAMING - Streaming request, streaming response (Orange)
export const IconGrpcBidiStreaming = ({ size = 18, strokeWidth = 1.5, className = '' }) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
strokeLinecap="round"
<svg
xmlns="http://www.w3.org/2000/svg"
width={size}
height={size}
viewBox="0 0 24 24"
fill="none"
strokeLinecap="round"
strokeLinejoin="round"
className={className}
>
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
{/* Request arrow (top) - right with double heads */}
<path d="M3 8h18" stroke="#F97316" strokeWidth={strokeWidth} />
<path d="M18 5l3 3l-3 3" stroke="#F97316" strokeWidth={strokeWidth} />
@@ -90,4 +90,4 @@ export const IconGrpcBidiStreaming = ({ size = 18, strokeWidth = 1.5, className
<path d="M6 13l-3 3l3 3" stroke="#F97316" strokeWidth={strokeWidth} />
<path d="M10 13l-3 3l3 3" stroke="#F97316" strokeWidth={strokeWidth} />
</svg>
);
);

View File

@@ -45,40 +45,42 @@ const getEffectiveAuthSource = (collection, item) => {
const Timeline = ({ collection, item }) => {
// Get the effective auth source if auth mode is inherit
const authSource = getEffectiveAuthSource(collection, item);
// TODO: reaper, might want to split it out and replicate the same timeline item as grpc
const isGrpcRequest = item.type === 'grpc-request' || item.type === 'ws-request';
// Filter timeline entries based on new rules
const combinedTimeline = [...(collection?.timeline || [])]
.filter((obj) => {
// Always show entries for this item
if (obj.itemUid === item.uid) return true;
const combinedTimeline = ([...(collection?.timeline || [])]).filter(obj => {
// Always show entries for this item
if (obj.itemUid === item.uid) return true;
// For OAuth2 entries, also show if auth is inherited
if (obj.type === 'oauth2' && authSource) {
if (authSource.type === 'folder' && obj.folderUid === authSource.uid) return true;
if (authSource.type === 'collection' && !obj.folderUid) return true;
}
// For OAuth2 entries, also show if auth is inherited
if (obj.type === 'oauth2' && authSource) {
if (authSource.type === 'folder' && obj.folderUid === authSource.uid) return true;
if (authSource.type === 'collection' && !obj.folderUid) return true;
}
return false;
})
.sort((a, b) => b.timestamp - a.timestamp);
return false;
}).sort((a, b) => b.timestamp - a.timestamp)
return (
<StyledWrapper className="pb-4 w-full flex flex-grow flex-col">
<StyledWrapper
className="pb-4 w-full flex flex-grow flex-col"
>
{/* Timeline container with scrollbar */}
<div className="timeline-container">
<div
className="timeline-container"
>
{combinedTimeline.map((event, index) => {
// Handle regular requests
if (event.type === 'request') {
const { data, timestamp, eventType } = event;
const { request, response, eventData = {}, timestamp: eventTimestamp = timestamp } = data;
const { data, timestamp, eventType } = event;
const { request, response, eventData = {}, timestamp: eventTimestamp = timestamp } = data;
if (isGrpcRequest) {
return (
<div key={index} className="timeline-event mb-2">
<GrpcTimelineItem
timestamp={eventTimestamp}
timestamp={eventTimestamp}
request={request}
response={response}
eventType={eventType}
@@ -89,7 +91,7 @@ const Timeline = ({ collection, item }) => {
</div>
);
}
// Regular HTTP request
return (
<div key={index} className="timeline-event mb-2">
@@ -117,7 +119,7 @@ const Timeline = ({ collection, item }) => {
<div className="mt-2">
{debugInfo && debugInfo.length > 0 ? (
debugInfo.map((data, idx) => (
<div className="ml-4" key={idx}>
<div className='ml-4' key={idx}>
<TimelineItem
timestamp={timestamp}
request={data?.request}
@@ -135,7 +137,7 @@ const Timeline = ({ collection, item }) => {
</div>
);
}
return null;
})}
</div>
@@ -143,4 +145,4 @@ const Timeline = ({ collection, item }) => {
);
};
export default Timeline;
export default Timeline;

View File

@@ -27,16 +27,16 @@ export const sendNetworkRequest = async (item, collection, environment, runtimeV
export const sendGrpcRequest = async (item, collection, environment, runtimeVariables) => {
return new Promise((resolve, reject) => {
startGrpcRequest(item, collection, environment, runtimeVariables)
.then((initialState) => {
// Return an initial state object to update the UI
// The real response data will be handled by event listeners
resolve({
...initialState,
timeline: []
});
})
.catch((err) => reject(err));
startGrpcRequest(item, collection, environment, runtimeVariables)
.then((initialState) => {
// Return an initial state object to update the UI
// The real response data will be handled by event listeners
resolve({
...initialState,
timeline: []
});
})
.catch((err) => reject(err));
});
};
@@ -79,19 +79,18 @@ export const startGrpcRequest = async (item, collection, environment, runtimeVar
const { ipcRenderer } = window;
const request = item.draft ? item.draft : item;
ipcRenderer
.invoke('grpc:start-connection', {
request,
collection,
environment,
runtimeVariables
})
.then(() => {
resolve();
})
.catch((err) => {
reject(err);
});
ipcRenderer.invoke('grpc:start-connection', {
request,
collection,
environment,
runtimeVariables
})
.then(() => {
resolve();
})
.catch(err => {
reject(err);
});
});
};
@@ -104,7 +103,9 @@ export const startGrpcRequest = async (item, collection, environment, runtimeVar
export const sendGrpcMessage = async (item, collectionUid, message) => {
return new Promise((resolve, reject) => {
const { ipcRenderer } = window;
ipcRenderer.invoke('grpc:send-message', item.uid, collectionUid, message).then(resolve).catch(reject);
ipcRenderer.invoke('grpc:send-message', item.uid, collectionUid, message)
.then(resolve)
.catch(reject);
});
};
@@ -116,7 +117,9 @@ export const sendGrpcMessage = async (item, collectionUid, message) => {
export const cancelGrpcRequest = async (requestId) => {
return new Promise((resolve, reject) => {
const { ipcRenderer } = window;
ipcRenderer.invoke('grpc:cancel', requestId).then(resolve).catch(reject);
ipcRenderer.invoke('grpc:cancel', requestId)
.then(resolve)
.catch(reject);
});
};
@@ -128,7 +131,9 @@ export const cancelGrpcRequest = async (requestId) => {
export const endGrpcStream = async (requestId) => {
return new Promise((resolve, reject) => {
const { ipcRenderer } = window;
ipcRenderer.invoke('grpc:end', requestId).then(resolve).catch(reject);
ipcRenderer.invoke('grpc:end', requestId)
.then(resolve)
.catch(reject);
});
};
@@ -168,9 +173,8 @@ export const endGrpcConnection = async (connectionId) => {
export const isGrpcConnectionActive = async (connectionId) => {
return new Promise((resolve, reject) => {
const { ipcRenderer } = window;
ipcRenderer
.invoke('grpc:is-connection-active', connectionId)
.then((response) => {
ipcRenderer.invoke('grpc:is-connection-active', connectionId)
.then(response => {
if (response.success) {
resolve(response.isActive);
} else {
@@ -179,7 +183,7 @@ export const isGrpcConnectionActive = async (connectionId) => {
resolve(false);
}
})
.catch((err) => {
.catch(err => {
console.error('Failed to check connection status:', err);
// On error, assume the connection is not active
resolve(false);
@@ -198,14 +202,13 @@ export const generateGrpcSampleMessage = async (methodPath, existingMessage = nu
return new Promise((resolve, reject) => {
const { ipcRenderer } = window;
ipcRenderer
.invoke('grpc:generate-sample-message', {
methodPath,
existingMessage,
options
})
.then(resolve)
.catch(reject);
ipcRenderer.invoke('grpc:generate-sample-message', {
methodPath,
existingMessage,
options
})
.then(resolve)
.catch(reject);
});
};