Fix: Filter for relation throws an error

[blankse]

Fix: #720

[kingjia90]

There is still something not right, maybe we should introduce also a minimum width?

[blankse]

@kingjia90 What did you config as width?

[kingjia90]

it's the default value in demo instance, i believe it's empty it's 96 but don't know from where it comes

[blankse]

@kingjia90 I changed it again 1bddd12
There are so many width keys in this fieldInfo object. I hope this is the right one. In my tests it works now.

[kingjia90]

weird, to me it doesn't work, it's the default 700, the table within the dialog seems crammed and not utilizing/distributing the width for each grid column

[blankse]

@kingjia90 What did you set as the width? I entered 1000 in this field in the demo, and it is now wider. Yes, the columns are narrow, but I believe that’s because they are empty at the beginning.

[blankse]

@kingjia90 I cleared the browser cache/cookies. Now the column widths also correct. Extjs saves the widths of the columns in the local storage:

[sonarqubecloud]

Quality Gate passed

Issues
1 New issue
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

[kingjia90]

@kingjia90 What did you set as the width? I entered 1000 in this field in the demo, and it is now wider. Yes, the columns are narrow, but I believe that’s because they are empty at the beginning.

i didn't set anything, that should be right, nevermind, it is just fine

@kingjia90 I cleared the browser cache/cookies. Now the column widths also correct. Extjs saves the widths of the columns in the local storage:

ahhh didn't know that... does it implicitly mean that we cannot use variable width and should be always fixed?

[blankse]

@kingjia90 It's not from ext js. It is here in the admin-ui-classic-bundle:

admin-ui-classic-bundle/public/js/pimcore/object/tags/manyToManyObjectRelation.js

Lines 405 to 426 in e3b66fb

	columns = Ext.Array.map(columns, function(column) {
	let columnWidth = this.getColumnWidth(column.dataIndex);
	if (columnWidth > 0) {
	column.width = columnWidth;
	}
	if (typeof column.width !== "undefined") {
	delete column.flex;
	}
	if(typeof column.listeners === "undefined") {
	column.listeners = {};
	}
	column.listeners.resize = function (columnKey, column, width) {
	localStorage.setItem(this.getColumnWidthLocalStorageKey(columnKey), width);
	}.bind(this, column.dataIndex);
	return column;
	}.bind(this));
	return columns;
	},

admin-ui-classic-bundle/public/js/pimcore/object/tags/abstractRelations.js

Lines 210 to 225 in e3b66fb

	getColumnWidthLocalStorageKey: function (column) {
	let context = this.context;
	delete context.objectId;
	context.column = column;
	return Object.values(context).join('_');
	},
	getColumnWidth: function (column) {
	let width = parseInt(localStorage.getItem(this.getColumnWidthLocalStorageKey(column)));
	if (width > 0) {
	return width;
	}
	return null;
	}

You have first open the filter with the very small window. So the columns was saved small. You can drag and drop the widths wider and it should be saved for the next window, right? When you have a empty local storage the columns have a correct width.

[kingjia90]

It seems it's because the grid is likely empty on first time opening as "Filter by relation" and therefore it doesn't have an estimation on how long each column would be. Ideally we should trigger this resize with localStorage.setItem on selecting/adding the first element

The current PR changes LGTM