From 45fdb7023e983cd2c152f93216afd993574d276a Mon Sep 17 00:00:00 2001
From: Gabriel Herbert <gabriel@rei3.de>
Date: Thu, 7 Nov 2024 10:48:34 +0100
Subject: [PATCH] Builder, shorten entity names if too long, small fixes

---
 www/comps/app.css                      |   9 ++
 www/comps/builder/builderApi.js        |   2 +-
 www/comps/builder/builderNew.js        |   2 +-
 www/comps/builder/builderPgTriggers.js |  70 ++++++-----
 www/comps/builder/builderPresets.js    |  20 ++--
 www/comps/builder/builderRelation.js   | 154 ++++++++++++-------------
 www/comps/builder/builderRelations.js  |  45 ++++----
 www/comps/builder/builderVariables.js  |  32 +++--
 www/comps/builder/builderWidgets.js    |  38 +++---
 9 files changed, 180 insertions(+), 192 deletions(-)

diff --git a/www/comps/app.css b/www/comps/app.css
index ad5fba88..3db977a0 100644
--- a/www/comps/app.css
+++ b/www/comps/app.css
@@ -904,6 +904,7 @@ table td.maximum{
 	margin:3px 8px 3px 0px;
 	display:flex;
 	flex-flow:row nowrap;
+	gap:calc(var(--spacing) / 2.5);
 	align-items:center;
 	justify-content:space-between;
 	font-size:100%;
@@ -945,6 +946,14 @@ table td.maximum{
 	display:flex;
 	flex-flow:column nowrap;
 	gap:5px;
+	flex:1 1 auto;
+	overflow:auto;
+}
+.generic-entry-list .lines span{
+	min-width:0px;
+	text-overflow:ellipsis;
+	white-space:nowrap;
+	overflow:hidden;
 }
 .generic-entry-list .subtitle{
 	font-size:80%;
diff --git a/www/comps/builder/builderApi.js b/www/comps/builder/builderApi.js
index 6e810ec5..a1fe26d7 100644
--- a/www/comps/builder/builderApi.js
+++ b/www/comps/builder/builderApi.js
@@ -185,7 +185,7 @@ let MyBuilderApiPreview = {
 			return out.length === 0 ? '' : `?${out.join('&')}`;
 		},
 		request:(s) => {
-			if(s.isAuth) return `{\n\t"username": "API_LOGIN_USERNAME",\n\t"password": "API_LOGIN_PASSWORD"\n}`;
+			if(s.isAuth) return `{\n\t"username": "API_USER_NAME",\n\t"password": "API_USER_PASSWORD"\n}`;
 			if(s.isPost) return s.getBodyPreview(true);
 			return s.capApp.empty;
 		},
diff --git a/www/comps/builder/builderNew.js b/www/comps/builder/builderNew.js
index b0add712..3a4eae33 100644
--- a/www/comps/builder/builderNew.js
+++ b/www/comps/builder/builderNew.js
@@ -151,7 +151,7 @@ let MyBuilderNew = {
 	computed:{
 		nameMaxLength:(s) => {
 			switch(s.entity) {
-				case 'api':        return 64; break;
+				case 'api':        return 60; break;
 				case 'collection': return 64; break;
 				case 'form':       return 64; break;
 				case 'jsFunction': return 64; break;
diff --git a/www/comps/builder/builderPgTriggers.js b/www/comps/builder/builderPgTriggers.js
index 2991fc3c..b14a59ef 100644
--- a/www/comps/builder/builderPgTriggers.js
+++ b/www/comps/builder/builderPgTriggers.js
@@ -21,44 +21,40 @@ let MyBuilderPgTriggers = {
 			@click="idEdit = trg.id"
 			v-for="trg in triggers"
 		>
-			<div class="row centered gap">
-				<my-button image="databasePlay.png"
-					:active="false"
-					:naked="true"
-				/>
-				<div class="lines">
-					<span>{{ trg.fires }}</span>
-					<span class="subtitle">
-						{{ isFromRelation ? pgFunctionIdMap[trg.pgFunctionId].name + '()' : relationIdMap[trg.relationId].name }}
-					</span>
-				</div>
-			</div>
-			<div class="row centered gap">
-				<my-button image="recordCreate.png"
-					v-if="trg.onInsert"
-					:active="false"
-					:captionTitle="capApp.onInsert"
-					:naked="true"
-				/>
-				<my-button image="recordUpdate.png"
-					v-if="trg.onUpdate"
-					:active="false"
-					:captionTitle="capApp.onUpdate"
-					:naked="true"
-				/>
-				<my-button image="recordDelete.png"
-					v-if="trg.onDelete"
-					:active="false"
-					:captionTitle="capApp.onDelete"
-					:naked="true"
-				/>
-				<my-button image="lettersZzz.png"
-					v-if="trg.isDeferred"
-					:active="false"
-					:captionTitle="capApp.isDeferred"
-					:naked="true"
-				/>
+			<my-button image="databasePlay.png"
+				:active="false"
+				:naked="true"
+			/>
+			<div class="lines">
+				<span>{{ trg.fires }}</span>
+				<span class="subtitle">
+					{{ isFromRelation ? pgFunctionIdMap[trg.pgFunctionId].name + '()' : relationIdMap[trg.relationId].name }}
+				</span>
 			</div>
+			<my-button image="recordCreate.png"
+				v-if="trg.onInsert"
+				:active="false"
+				:captionTitle="capApp.onInsert"
+				:naked="true"
+			/>
+			<my-button image="recordUpdate.png"
+				v-if="trg.onUpdate"
+				:active="false"
+				:captionTitle="capApp.onUpdate"
+				:naked="true"
+			/>
+			<my-button image="recordDelete.png"
+				v-if="trg.onDelete"
+				:active="false"
+				:captionTitle="capApp.onDelete"
+				:naked="true"
+			/>
+			<my-button image="lettersZzz.png"
+				v-if="trg.isDeferred"
+				:active="false"
+				:captionTitle="capApp.isDeferred"
+				:naked="true"
+			/>
 		</div>
 		
 		<my-builder-pg-trigger
diff --git a/www/comps/builder/builderPresets.js b/www/comps/builder/builderPresets.js
index 456dbc0e..af6cecf2 100644
--- a/www/comps/builder/builderPresets.js
+++ b/www/comps/builder/builderPresets.js
@@ -20,18 +20,14 @@ let MyBuilderPresets = {
 			@click="idEdit = p.id"
 			v-for="p in relation.presets.filter(v => filter === '' || v.name.toLowerCase().includes(filter.toLowerCase()))"
 		>
-			<div class="row centered gap">
-				<my-button
-					:active="false"
-					:image="p.protected ? 'lock.png' : 'lockOpen.png'"
-					:naked="true"
-				/>
-				<div class="lines">
-					<span>{{ p.name }}</span>
-					<span class="subtitle">{{ getPreview(p) }}</span>
-				</div>
-			</div>
-			<div class="row centered gap">
+			<my-button
+				:active="false"
+				:image="p.protected ? 'lock.png' : 'lockOpen.png'"
+				:naked="true"
+			/>
+			<div class="lines">
+				<span>{{ p.name }}</span>
+				<span class="subtitle">{{ getPreview(p) }}</span>
 			</div>
 		</div>
 		
diff --git a/www/comps/builder/builderRelation.js b/www/comps/builder/builderRelation.js
index 3357895e..b5d1c4db 100644
--- a/www/comps/builder/builderRelation.js
+++ b/www/comps/builder/builderRelation.js
@@ -188,48 +188,44 @@ let MyBuilderRelation = {
 					@click="attributeIdEdit = atr.id"
 					v-for="atr in relation.attributes.filter(v => nameFilter === '' || v.name.includes(nameFilter.toLowerCase()))"
 				>
-					<div class="row centered gap">
-						<my-button
-							:active="false"
-							:captionTitle="capApp.attributeContent"
-							:image="getAttributeIcon(atr.content,atr.contentUse,false,false)"
-							:naked="true"
-						/>
-						<div class="lines">
-							<span>{{ atr.name }}</span>
-							<span class="subtitle" v-if="typeof atr.captions.attributeTitle[builderLanguage] !== 'undefined'">
-								[{{ atr.captions.attributeTitle[builderLanguage] }}]
-							</span>
-						</div>
-					</div>
-					<div class="row centered gap">
-						<my-button image="lock.png"
-							v-if="atr.encrypted"
-							:active="false"
-							:captionTitle="capApp.attributeEncrypted"
-							:naked="true"
-						/>
-						<my-button
-							v-if="isAttributeWithLength(atr.content) && atr.length !== 0"
-							:active="false"
-							:caption="'['+String(atr.length)+']'"
-							:captionTitle="capApp.attributeLength"
-							:naked="true"
-						/>
-						<my-button image="asterisk.png"
-							v-if="!atr.nullable"
-							:active="false"
-							:captionTitle="capApp.attributeNotNullable"
-							:naked="true"
-						/>
-						<my-button
-							:active="false"
-							:captionTitle="atr.iconId === null ? capApp.attributeNoIcon : capGen.icon"
-							:image="atr.iconId === null ? 'icon_missing.png' : ''"
-							:imageBase64="atr.iconId !== null ? srcBase64(iconIdMap[atr.iconId].file) : ''"
-							:naked="true"
-						/>
+					<my-button
+						:active="false"
+						:captionTitle="capApp.attributeContent"
+						:image="getAttributeIcon(atr.content,atr.contentUse,false,false)"
+						:naked="true"
+					/>
+					<div class="lines">
+						<span>{{ atr.name }}</span>
+						<span class="subtitle" v-if="typeof atr.captions.attributeTitle[builderLanguage] !== 'undefined'">
+							[{{ atr.captions.attributeTitle[builderLanguage] }}]
+						</span>
 					</div>
+					<my-button image="lock.png"
+						v-if="atr.encrypted"
+						:active="false"
+						:captionTitle="capApp.attributeEncrypted"
+						:naked="true"
+					/>
+					<my-button
+						v-if="isAttributeWithLength(atr.content) && atr.length !== 0"
+						:active="false"
+						:caption="'['+String(atr.length)+']'"
+						:captionTitle="capApp.attributeLength"
+						:naked="true"
+					/>
+					<my-button image="asterisk.png"
+						v-if="!atr.nullable"
+						:active="false"
+						:captionTitle="capApp.attributeNotNullable"
+						:naked="true"
+					/>
+					<my-button
+						:active="false"
+						:captionTitle="atr.iconId === null ? capApp.attributeNoIcon : capGen.icon"
+						:image="atr.iconId === null ? 'icon_missing.png' : ''"
+						:imageBase64="atr.iconId !== null ? srcBase64(iconIdMap[atr.iconId].file) : ''"
+						:naked="true"
+					/>
 				</div>
 				
 				<!-- attribute dialog -->
@@ -262,46 +258,42 @@ let MyBuilderRelation = {
 					@click="indexIdEdit = ind.id"
 					v-for="ind in relation.indexes"
 				>
-					<div class="row centered gap">
-						<my-button image="databaseAsterisk.png"
-							:active="false"
-							:naked="true"
-						/>
-						<div class="lines"><span>{{ displayIndexName(ind) }}</span></div>
-					</div>
-					<div class="row centered gap">
-						<my-button image="asterisk.png"
-							v-if="ind.noDuplicates"
-							:active="false"
-							:captionTitle="capApp.indexUnique"
-							:naked="true"
-						/>
-						<my-button image="cogMultiple.png"
-							v-if="ind.primaryKey || ind.autoFki"
-							:active="false"
-							:captionTitle="capApp.indexSystem"
-							:naked="true"
-						/>
-						<my-button image="key.png"
-							v-if="ind.primaryKey"
-							:active="false"
-							:captionTitle="capApp.indexPrimaryKey"
-							:naked="true"
-						/>
-						<my-button
-							v-if="ind.autoFki"
-							:active="false"
-							:captionTitle="capApp.indexAutoFki"
-							:image="attributeIdMap[ind.attributes[0].attributeId].content === '1:1' ? 'link1.png' : 'link3.png'"
-							:naked="true"
-						/>
-						<my-button image="languages.png"
-							v-if="ind.method === 'GIN'"
-							:active="false"
-							:captionTitle="capApp.indexText"
-							:naked="true"
-						/>
-					</div>
+					<my-button image="databaseAsterisk.png"
+						:active="false"
+						:naked="true"
+					/>
+					<div class="lines"><span>{{ displayIndexName(ind) }}</span></div>
+					<my-button image="asterisk.png"
+						v-if="ind.noDuplicates"
+						:active="false"
+						:captionTitle="capApp.indexUnique"
+						:naked="true"
+					/>
+					<my-button image="cogMultiple.png"
+						v-if="ind.primaryKey || ind.autoFki"
+						:active="false"
+						:captionTitle="capApp.indexSystem"
+						:naked="true"
+					/>
+					<my-button image="key.png"
+						v-if="ind.primaryKey"
+						:active="false"
+						:captionTitle="capApp.indexPrimaryKey"
+						:naked="true"
+					/>
+					<my-button
+						v-if="ind.autoFki"
+						:active="false"
+						:captionTitle="capApp.indexAutoFki"
+						:image="attributeIdMap[ind.attributes[0].attributeId].content === '1:1' ? 'link1.png' : 'link3.png'"
+						:naked="true"
+					/>
+					<my-button image="languages.png"
+						v-if="ind.method === 'GIN'"
+						:active="false"
+						:captionTitle="capApp.indexText"
+						:naked="true"
+					/>
 				</div>
 				
 				<!-- index dialog -->
diff --git a/www/comps/builder/builderRelations.js b/www/comps/builder/builderRelations.js
index 9406b816..cb742df1 100644
--- a/www/comps/builder/builderRelations.js
+++ b/www/comps/builder/builderRelations.js
@@ -33,29 +33,30 @@ let MyBuilderRelations = {
 					:title="r.comment"
 					:to="'/builder/relation/'+r.id" 
 				>
-					<span>{{ r.name }}</span>
-					<div class="row gap">
-						<my-button image="lock.png"
-							v-if="r.encryption"
-							:active="false"
-							:captionTitle="capApp.encryptionHint"
-							:naked="true"
-						/>
-						<my-button image="time.png"
-							v-if="r.retentionCount !== null || r.retentionDays !== null"
-							:active="false"
-							:caption="displayRetention(r)"
-							:captionTitle="capApp.retentionHint"
-							:naked="true"
-						/>
-						<my-button image="files_list2.png"
-							v-if="r.attributes.length !== 0"
-							:active="false"
-							:caption="String(r.attributes.length)"
-							:captionTitle="capApp.attributes.replace('{CNT}',r.attributes.length)"
-							:naked="true"
-						/>
+					<div class="lines">
+						<span>{{ r.name }}</span>
+						<span class="subtitle" v-if="r.comment !== null">{{ r.comment }}</span>
 					</div>
+					<my-button image="lock.png"
+						v-if="r.encryption"
+						:active="false"
+						:captionTitle="capApp.encryptionHint"
+						:naked="true"
+					/>
+					<my-button image="time.png"
+						v-if="r.retentionCount !== null || r.retentionDays !== null"
+						:active="false"
+						:caption="displayRetention(r)"
+						:captionTitle="capApp.retentionHint"
+						:naked="true"
+					/>
+					<my-button image="files_list2.png"
+						v-if="r.attributes.length !== 0"
+						:active="false"
+						:caption="String(r.attributes.length)"
+						:captionTitle="capApp.attributes.replace('{CNT}',r.attributes.length)"
+						:naked="true"
+					/>
 				</router-link>
 			</div>
 		</div>
diff --git a/www/comps/builder/builderVariables.js b/www/comps/builder/builderVariables.js
index b7acb6a1..f449d828 100644
--- a/www/comps/builder/builderVariables.js
+++ b/www/comps/builder/builderVariables.js
@@ -35,25 +35,21 @@ let MyBuilderVariables = {
 					v-for="v in module.variables.filter(v => filter === '' || v.name.toLowerCase().includes(filter.toLowerCase()))"
 					@click="variableIdEdit = v.id"
 				>
-					<div class="row centered gap">
-						<my-button
-							:active="false"
-							:image="getAttributeIcon(v.content,v.contentUse,false,false)"
-							:naked="true"
-						/>
-						<div class="lines">
-							<span v-if="v.formId === null">{{ v.name }}</span>
-							<span v-if="v.formId !== null"><b>{{ formIdMap[v.formId].name }}:</b> {{ v.name }}</span>
-						</div>
-					</div>
-					<div class="row">
-						<my-button image="fileText.png"
-							v-if="v.formId !== null"
-							:active="false"
-							:captionTitle="capApp.form"
-							:naked="true"
-						/>
+					<my-button
+						:active="false"
+						:image="getAttributeIcon(v.content,v.contentUse,false,false)"
+						:naked="true"
+					/>
+					<div class="lines">
+						<span v-if="v.formId === null">{{ v.name }}</span>
+						<span v-if="v.formId !== null"><b>{{ formIdMap[v.formId].name }}:</b> {{ v.name }}</span>
 					</div>
+					<my-button image="fileText.png"
+						v-if="v.formId !== null"
+						:active="false"
+						:captionTitle="capApp.form"
+						:naked="true"
+					/>
 				</div>
 			</div>
 		</div>
diff --git a/www/comps/builder/builderWidgets.js b/www/comps/builder/builderWidgets.js
index e4cd80cd..7055edf5 100644
--- a/www/comps/builder/builderWidgets.js
+++ b/www/comps/builder/builderWidgets.js
@@ -40,26 +40,24 @@ let MyBuilderWidgets = {
 							[{{ w.captions.widgetTitle[builderLanguage] }}]
 						</span>
 					</div>
-					<div class="row">
-						<my-button image="tiles.png"
-							:active="false"
-							:caption="String(w.size)"
-							:captionTitle="capGen.size"
-							:naked="true"
-						/>
-						<my-button image="tray.png"
-							v-if="w.collection !== null"
-							:active="false"
-							:captionTitle="capGen.collection"
-							:naked="true"
-						/>
-						<my-button image="fileText.png"
-							v-if="w.formId !== null"
-							:active="false"
-							:captionTitle="capGen.form"
-							:naked="true"
-						/>
-					</div>
+					<my-button image="tiles.png"
+						:active="false"
+						:caption="String(w.size)"
+						:captionTitle="capGen.size"
+						:naked="true"
+					/>
+					<my-button image="tray.png"
+						v-if="w.collection !== null"
+						:active="false"
+						:captionTitle="capGen.collection"
+						:naked="true"
+					/>
+					<my-button image="fileText.png"
+						v-if="w.formId !== null"
+						:active="false"
+						:captionTitle="capGen.form"
+						:naked="true"
+					/>
 				</div>
 			</div>
 		</div>