fix: trace page breaking (#4844)

* fix: trace page breaking

* fix: crash on reload

* fix: hide update button for viewer role in collapsed mode
This commit is contained in:
Vikrant Gupta 2024-04-09 19:20:08 +05:30 committed by GitHub
parent 25b74b48a5
commit 03dccb0101
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 25 additions and 19 deletions

View File

@ -1,10 +1,10 @@
.hide-update {
left: calc(50% - 41px) !important;
left: calc(50% - 72px) !important;
}
.explorer-update {
position: fixed;
bottom: 24px;
left: calc(50% - 250px);
left: calc(50% - 352px);
display: flex;
align-items: center;
gap: 12px;

View File

@ -400,7 +400,8 @@ function ExplorerOptions({
>
Add to Dashboard
</Button>
</div>
<div className="actions">
<Tooltip title="Hide">
<Button
disabled={disabled}
@ -420,6 +421,7 @@ function ExplorerOptions({
isQueryUpdated={isQueryUpdated}
handleClearSelect={handleClearSelect}
onUpdateQueryHandler={onUpdateQueryHandler}
isEditDeleteSupported={isEditDeleteSupported}
/>
<Modal

View File

@ -16,6 +16,7 @@ interface DroppableAreaProps {
setIsExplorerOptionHidden?: Dispatch<SetStateAction<boolean>>;
handleClearSelect: () => void;
onUpdateQueryHandler: () => void;
isEditDeleteSupported: boolean;
}
function ExplorerOptionsHideArea({
@ -25,6 +26,7 @@ function ExplorerOptionsHideArea({
setIsExplorerOptionHidden,
handleClearSelect,
onUpdateQueryHandler,
isEditDeleteSupported,
}: DroppableAreaProps): JSX.Element {
const handleShowExplorerOption = (): void => {
if (setIsExplorerOptionHidden) {
@ -47,14 +49,16 @@ function ExplorerOptionsHideArea({
icon={<X size={14} color={Color.BG_INK_500} />}
/>
</Tooltip>
<Tooltip title="Update this View">
<Button
onClick={onUpdateQueryHandler}
className="action-btn"
style={{ background: Color.BG_ROBIN_500 }}
icon={<Disc3 size={14} color={Color.BG_INK_500} />}
/>
</Tooltip>
{isEditDeleteSupported && (
<Tooltip title="Update this View">
<Button
onClick={onUpdateQueryHandler}
className="action-btn"
style={{ background: Color.BG_ROBIN_500 }}
icon={<Disc3 size={14} color={Color.BG_INK_500} />}
/>
</Tooltip>
)}
</div>
)}
<Button

View File

@ -307,7 +307,7 @@ function NewWidget({ selectedGraph }: NewWidgetProps): JSX.Element {
updatedQuery,
{ [QueryParams.graphType]: type },
undefined,
false,
true,
);
};

View File

@ -534,12 +534,12 @@ export function QueryBuilderProvider({
}
const queryItem = item as IBuilderQuery;
const propsRequired =
panelTypeDataSourceFormValuesMap[panelType as keyof PartialPanelTypes][
panelTypeDataSourceFormValuesMap[panelType as keyof PartialPanelTypes]?.[
queryItem.dataSource
].builder.queryData;
propsRequired.push('dataSource');
propsRequired.forEach((p: any) => {
propsRequired?.push('dataSource');
propsRequired?.forEach((p: any) => {
set(queryItem, p, get(newQueryItem, p));
});
return queryItem;
@ -674,7 +674,7 @@ export function QueryBuilderProvider({
query: Partial<Query>,
searchParams?: Record<string, unknown>,
redirectingUrl?: typeof ROUTES[keyof typeof ROUTES],
shallStringify?: boolean,
shouldNotStringify?: boolean,
) => {
const queryType =
!query.queryType || !Object.values(EQueryType).includes(query.queryType)
@ -728,9 +728,9 @@ export function QueryBuilderProvider({
Object.keys(searchParams).forEach((param) =>
urlQuery.set(
param,
shallStringify
? JSON.stringify(searchParams[param])
: (searchParams[param] as string),
shouldNotStringify
? (searchParams[param] as string)
: JSON.stringify(searchParams[param]),
),
);
}