From 6a051450c2fc0ac06eeee120e6621bc687cbea2e Mon Sep 17 00:00:00 2001
From: Anna Schoderer <anna.schoderer@deutschebahn.com>
Date: Tue, 24 Jan 2023 16:42:46 +0100
Subject: [PATCH 1/2] fix: prevent double click events in angular

---
 .../src/components/button/button.lite.tsx     |   3 -
 .../src/components/card/card.lite.tsx         |   3 -
 packages/components/src/shared/model.ts       |   1 -
 .../src/app/app.component.html                |   2 +-
 .../src/app/app.component.ts                  |   4 +
 showcases/react-showcase/src/app.tsx          | 176 +++++++++---------
 showcases/vue-showcase/src/App.vue            |   8 +-
 7 files changed, 103 insertions(+), 94 deletions(-)

diff --git a/packages/components/src/components/button/button.lite.tsx b/packages/components/src/components/button/button.lite.tsx
index 1775eb9a6e8..a68dbae2ad3 100644
--- a/packages/components/src/components/button/button.lite.tsx
+++ b/packages/components/src/components/button/button.lite.tsx
@@ -36,9 +36,6 @@ export default function DBButton(props: DBButtonProps) {
 			if (props.onClick) {
 				props.onClick(event);
 			}
-			if (props.click) {
-				props.click(event);
-			}
 		}
 	});
 
diff --git a/packages/components/src/components/card/card.lite.tsx b/packages/components/src/components/card/card.lite.tsx
index d8de6ee3dd0..a5cec960a2d 100644
--- a/packages/components/src/components/card/card.lite.tsx
+++ b/packages/components/src/components/card/card.lite.tsx
@@ -32,9 +32,6 @@ export default function DBCard(props: DBCardProps) {
 			if (props.onClick) {
 				props.onClick(event);
 			}
-			if (props.click) {
-				props.click(event);
-			}
 		}
 	});
 
diff --git a/packages/components/src/shared/model.ts b/packages/components/src/shared/model.ts
index 4afaf88e8c3..703910dd3f6 100644
--- a/packages/components/src/shared/model.ts
+++ b/packages/components/src/shared/model.ts
@@ -16,7 +16,6 @@ export type GlobalTextProps = {
 };
 
 export type ClickEventProps = {
-	click?: (event: any) => void;
 	onClick?: (event: any) => void;
 };
 
diff --git a/showcases/angular-current-showcase/src/app/app.component.html b/showcases/angular-current-showcase/src/app/app.component.html
index dd6eac4a306..ce85fd76faa 100644
--- a/showcases/angular-current-showcase/src/app/app.component.html
+++ b/showcases/angular-current-showcase/src/app/app.component.html
@@ -3,7 +3,7 @@ <h1>Angular</h1>
 	<DBCard>
 		<div style="display: flex; gap: 4px; align-items: center">
 			<DBButton variant="secondary">Test</DBButton>
-			<DBButton text="Test" icon="account"></DBButton>
+			<DBButton text="Test" icon="account" (click)="onClick()"></DBButton>
 			<DBIcon icon="account"></DBIcon>
 
 			<section class="db-ui-expressive">
diff --git a/showcases/angular-current-showcase/src/app/app.component.ts b/showcases/angular-current-showcase/src/app/app.component.ts
index 9b7f49eb7b1..39c6f5b7b45 100644
--- a/showcases/angular-current-showcase/src/app/app.component.ts
+++ b/showcases/angular-current-showcase/src/app/app.component.ts
@@ -16,4 +16,8 @@ export class AppComponent {
 		},
 		{ name: 'tab-bar-2', label: '2-Tab2', content: 'Content 2-2' }
 	];
+
+	onClick() {
+		console.log("click button");
+	}
 }
diff --git a/showcases/react-showcase/src/app.tsx b/showcases/react-showcase/src/app.tsx
index 2b51307fa22..5b5d8e3f8b9 100644
--- a/showcases/react-showcase/src/app.tsx
+++ b/showcases/react-showcase/src/app.tsx
@@ -6,98 +6,104 @@ import {
 	DBInput
 } from '../../../output/react/src';
 
-const App = () => (
-	<main>
-		<h1>React</h1>
-		<DBCard>
+const App = () => {
+
+	const onClick = (event: any) => {
+		console.log("test");
+	}
+
+	return (
+		<main>
+			<h1>React</h1>
+			<DBCard>
+				<div
+					style={{
+						display: 'flex',
+						gap: '4px',
+						alignItems: 'stretch'
+					}}>
+					<DBDivider variant="vertical" />
+					<DBButton variant="secondary">Test</DBButton>
+					<DBDivider variant="vertical" />
+					<DBButton text="Test" icon="account" onClick={onClick} />
+					<DBIcon className="icon" icon="account" />
+				</div>
+			</DBCard>
+
 			<div
 				style={{
 					display: 'flex',
-					gap: '4px',
-					alignItems: 'stretch'
+					gap: '1rem',
+					margin: '1rem 0'
 				}}>
-				<DBDivider variant="vertical" />
-				<DBButton variant="secondary">Test</DBButton>
-				<DBDivider variant="vertical" />
-				<DBButton text="Test" icon="account" />
-				<DBIcon className="icon" icon="account" />
-			</div>
-		</DBCard>
-
-		<div
-			style={{
-				display: 'flex',
-				gap: '1rem',
-				margin: '1rem 0'
-			}}>
-			<section className="db-ui-expressive">
-				<DBInput
-					description="Das ist die Beschreibung"
-					label="Startbahnhof eingeben"
-					placeholder="irgendein Text"
-					iconBefore="edit"
-					variant="error"
-					value="hello"
-				/>
+				<section className="db-ui-expressive">
+					<DBInput
+						description="Das ist die Beschreibung"
+						label="Startbahnhof eingeben"
+						placeholder="irgendein Text"
+						iconBefore="edit"
+						variant="error"
+						value="hello"
+					/>
 
-				<DBInput
-					description="Valid test"
-					label="Mit Event"
-					placeholder="irgendein Text"
-					iconBefore="edit"
-					iconAfter="heart"
-					variant="warning"
-					id="input-expr-warning"
-					required={true}
-				/>
-				<DBInput
-					label="Startdatum"
-					placeholder="irgendein Text"
-					type="datetime-local"
-					id="input-expr-date"
-				/>
-			</section>
+					<DBInput
+						description="Valid test"
+						label="Mit Event"
+						placeholder="irgendein Text"
+						iconBefore="edit"
+						iconAfter="heart"
+						variant="warning"
+						id="input-expr-warning"
+						required={true}
+					/>
+					<DBInput
+						label="Startdatum"
+						placeholder="irgendein Text"
+						type="datetime-local"
+						id="input-expr-date"
+					/>
+				</section>
 
-			<section className="db-ui-regular">
-				<DBInput
-					label="Startbahnhof eingeben"
-					placeholder="irgendein Text"
-					iconAfter="heart"
-					id="input-reg"
-					required={true}
-					minLength={5}
-				/>
-				<DBInput
-					label="Startdatum"
-					placeholder="irgendein Text"
-					type="week"
-					id="input-reg-date"
-				/>
-			</section>
+				<section className="db-ui-regular">
+					<DBInput
+						label="Startbahnhof eingeben"
+						placeholder="irgendein Text"
+						iconAfter="heart"
+						id="input-reg"
+						required={true}
+						minLength={5}
+					/>
+					<DBInput
+						label="Startdatum"
+						placeholder="irgendein Text"
+						type="week"
+						id="input-reg-date"
+					/>
+				</section>
 
-			<section className="db-ui-functional">
-				<DBInput
-					id="db-input-functional-1"
-					label="Startbahnhof eingeben"
-					placeholder="irgendein Text"
-				/>
-				<DBInput
-					id="db-input-functional-2"
-					label="Textinput eingeben disabled"
-					placeholder="irgendein Text"
-					variant="information"
-					disabled={true}
-				/>
+				<section className="db-ui-functional">
+					<DBInput
+						id="db-input-functional-1"
+						label="Startbahnhof eingeben"
+						placeholder="irgendein Text"
+					/>
+					<DBInput
+						id="db-input-functional-2"
+						label="Textinput eingeben disabled"
+						placeholder="irgendein Text"
+						variant="information"
+						disabled={true}
+					/>
 
-				<DBInput
-					label="Startdatum"
-					placeholder="irgendein Text"
-					type="datetime-local"
-					id="input-func-date"
-				/>
-			</section>
-		</div>
-	</main>
-);
+					<DBInput
+						label="Startdatum"
+						placeholder="irgendein Text"
+						type="datetime-local"
+						id="input-func-date"
+					/>
+				</section>
+			</div>
+		</main>
+	);};
 
 export default App;
diff --git a/showcases/vue-showcase/src/App.vue b/showcases/vue-showcase/src/App.vue
index cd3aa756f6b..164b215a686 100644
--- a/showcases/vue-showcase/src/App.vue
+++ b/showcases/vue-showcase/src/App.vue
@@ -5,6 +5,12 @@ import {
 	DBCard,
 	DBInput
 } from "../../../output/vue/vue3/src";
+
+function onClick() {
+ console.log("Button clicked");
+}
+
+
 </script>
 
 <template>
@@ -13,7 +19,7 @@ import {
 		<DBCard>
 			<div style="display: flex; gap: 4px; align-items: center">
 				<DBButton variant="secondary">Test</DBButton>
-				<DBButton text="Test" icon="account" />
+				<DBButton text="Test" icon="account" @click="onClick"/>
 				<DBIcon icon="account" />
 			</div>
 		</DBCard>

From 1879a4b4be4d4ee94d01675fdb20a0af7daa3fbc Mon Sep 17 00:00:00 2001
From: Anna Schoderer <anna.schoderer@deutschebahn.com>
Date: Tue, 24 Jan 2023 16:49:18 +0100
Subject: [PATCH 2/2] fix: added commit mail

---
 .husky/commit-msg                                         | 0
 .husky/pre-commit                                         | 0
 .../angular-current-showcase/src/app/app.component.ts     | 2 +-
 showcases/react-showcase/src/app.tsx                      | 8 ++++----
 4 files changed, 5 insertions(+), 5 deletions(-)
 mode change 100644 => 100755 .husky/commit-msg
 mode change 100644 => 100755 .husky/pre-commit

diff --git a/.husky/commit-msg b/.husky/commit-msg
old mode 100644
new mode 100755
diff --git a/.husky/pre-commit b/.husky/pre-commit
old mode 100644
new mode 100755
diff --git a/showcases/angular-current-showcase/src/app/app.component.ts b/showcases/angular-current-showcase/src/app/app.component.ts
index 39c6f5b7b45..d990e61df47 100644
--- a/showcases/angular-current-showcase/src/app/app.component.ts
+++ b/showcases/angular-current-showcase/src/app/app.component.ts
@@ -18,6 +18,6 @@ export class AppComponent {
 	];
 
 	onClick() {
-		console.log("click button");
+		console.log('click button');
 	}
 }
diff --git a/showcases/react-showcase/src/app.tsx b/showcases/react-showcase/src/app.tsx
index 5b5d8e3f8b9..e17414708df 100644
--- a/showcases/react-showcase/src/app.tsx
+++ b/showcases/react-showcase/src/app.tsx
@@ -7,10 +7,9 @@ import {
 } from '../../../output/react/src';
 
 const App = () => {
-
 	const onClick = (event: any) => {
-		console.log("test");
-	}
+		console.log('test');
+	};
 
 	return (
 		<main>
@@ -104,6 +103,7 @@ const App = () => {
 				</section>
 			</div>
 		</main>
-	);};
+	);
+};
 
 export default App;