Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix/cardinality dashboard UI bugs #382

Merged
merged 3 commits into from
Dec 15, 2023
Merged

Fix/cardinality dashboard UI bugs #382

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6df4542
fix: menu blocking ui
jacovinus Dec 15, 2023
f4d17c9
fix: error with label values at Cardinality
jacovinus Dec 15, 2023
5b5f740
fix: buttons contrast
jacovinus Dec 15, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/main/plugins/Cardinality/ConfigContainerStyles.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ export const ConfigContainerStyles = (theme: any) => css`
height: 30px;
transition: 0.35s all;
background: ${theme.primaryAccent};
color: ${theme.contrast};
color: ${theme.maxContrast};
padding: 4px 6px;
border-radius: 3px;
border: 1px solid ${theme.primary};
Expand Down
10 changes: 5 additions & 5 deletions packages/main/plugins/Cardinality/DayPicker.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,20 +61,20 @@ export const MenuStyles = (theme: any) => ({
"& .icon": {
fontSize: "16px",
marginRight: "4px",
color: `${theme.contrast}`,
color: `${theme.maxContrast}`,
},
"& .item": {
fontSize: "12px",
color: `${theme.contrast}`,
color: `${theme.maxContrast}`,
},
".rdp-day_selected, .rdp-day_selected:focus-visible, .rdp-day_selected:hover":
{
background: `${theme.primary}`,
color: `${theme.contrast}`,
color: `${theme.maxContrast}`,
},
"& .rdp-day_selected : hover": {
background: `${theme.primary}`,
color: `${theme.contrast}`,
color: `${theme.maxContrast}`,
},
});

Expand Down Expand Up @@ -139,7 +139,7 @@ export default function PickerMenu() {
size="small"
sx={{
ml: 2,
color: `${theme.contrast}`,
color: `${theme.maxContrast}`,
background: `${theme.primaryAccent}`,
"&.MuiIconButton-root": {
border: `1px solid ${theme.primary}`,
Expand Down
29 changes: 27 additions & 2 deletions packages/main/plugins/Cardinality/helpers.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,9 @@ export const getValuesArrayToString = (values: string[]): string => {
return values?.map((value) => `\"${value}\"`).join(",");
};

const labelsFreq = (arr: string[]) =>
arr.reduce((cnt, cur) => ((cnt[cur] = cnt[cur] + 1 || 1), cnt), {});

/**
*
* @param labelsArray
Expand All @@ -31,7 +34,26 @@ const getSeriesArraySelector = (labelsArray: string[]): string => {

let LabelsString = "{";
let labelslength = labelsArray.length;

let lsarray = [];
// generate labels array splitting by equals or non equals
for (let i = 0; i < labelslength; i++) {
const [label] = labelsArray[i].split(/(=|!=)/);
lsarray.push(label);
}
// check for frequency of same label
const labelsFrequency = labelsFreq(lsarray);

for (let i = 0; i < labelslength; i++) {
let currentLabel = lsarray[i];
// check if non equals label is hit and another one in the room is present
if (
labelsArray[i].includes("!=") &&
labelsFrequency[currentLabel] > 1
) {
continue;
}

const [lb, val] = labelsArray[i].split("=");

LabelsString += `${lb}=\"${val}\"`;
Expand Down Expand Up @@ -60,7 +82,10 @@ export const queryUpdater: QueryUpdater = {
return getSeriesSelector("__name__", query);
},
seriesCountByLabelName: ({ query }): string => {
return `{${query}!=""}`;
const queryStr = `{${query}!=""}`;
localStorage.setItem("labelValuePairs", `${query}!=`);

return queryStr;
},
seriesCountByFocusLabelValue: ({ query, focusLabel }): string => {
return getSeriesSelector(focusLabel, query);
Expand Down Expand Up @@ -229,7 +254,7 @@ export const useDataSourceData = (type: string) => {

const isAuth = authData.basicAuth.value;

let user_pass= {u: '', p:''}
let user_pass = { u: "", p: "" };

if (isAuth) {
let [user, password] = authData.fields.basicAuth;
Expand Down
26 changes: 14 additions & 12 deletions packages/main/plugins/settingsmenu/MainMenu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ export const ButtonMenuStyles = (theme: QrynTheme) => ({
});

export default function MainMenu() {
const {key} = useLocation()
const { key } = useLocation();
const showDs = useSelector((store: any) => store.showDataSourceSetting);
const currentUserRole = useSelector((store: any) => store.currentUser.role);
const dispatch: any = useDispatch();
Expand All @@ -52,17 +52,19 @@ export default function MainMenu() {
setUserType(currentUserRole);
}, [currentUserRole]);

useEffect(()=>{
handleClose()

},[key])
useEffect(() => {
handleClose();
}, [key]);

const handleClick = (event: React.MouseEvent<HTMLElement>) => {
event.stopPropagation();
event.preventDefault();
setAnchorEl(() => event.currentTarget);
};

const handleClose = () => {

const handleClose = (event?: any) => {
event?.stopPropagation();
event?.preventDefault();
setAnchorEl(() => undefined);
};

Expand Down Expand Up @@ -97,7 +99,7 @@ export default function MainMenu() {
anchorEl={anchorEl}
open={open}
onClose={handleClose}
onClick={handleClose}
onClick={handleClick}
PaperProps={{
elevation: 0,
sx: MenuStyles(theme),
Expand All @@ -114,21 +116,21 @@ export default function MainMenu() {
<Divider />

<Link to="/">
<MenuItem className={"item"} onClick={handleClose}>
<MenuItem className={"item"}>
<TravelExploreIcon className="icon" />
Search
</MenuItem>
</Link>

<Link to="/plugins">
<MenuItem className={"item"} onClick={handleClose}>
<MenuItem className={"item"}>
<ExtensionIcon className="icon" />
Plugins
</MenuItem>
</Link>

<Link to="/users">
<MenuItem className={"item"} onClick={handleClose}>
<MenuItem className={"item"}>
<PersonOutlineOutlinedIcon className="icon" />
Users
</MenuItem>
Expand All @@ -137,7 +139,7 @@ export default function MainMenu() {
{showDs &&
(userType === "admin" || userType === "superAdmin") && (
<Link to="datasources">
<MenuItem className={"item"} onClick={handleClose}>
<MenuItem className={"item"}>
<StorageIcon className="icon" />
Datasources
</MenuItem>
Expand Down
Loading