From 6976d85a7117de53f7d42dee3de1f6b8fcb9726d Mon Sep 17 00:00:00 2001
From: Daniel Karbach <daniel.karbach@localhorst.tv>
Date: Fri, 28 Jul 2023 12:42:01 +0200
Subject: [PATCH] tech title icons

---
 app/Models/Technique.php                      |  1 +
 .../2023_07_28_095933_tech_title_icons.php    | 32 +++++++++++++++++++
 resources/js/components/common/ZeldaIcon.js   | 13 +++++---
 resources/js/components/map/Popover.js        |  9 ++++++
 resources/js/i18n/de.js                       |  1 +
 resources/js/i18n/en.js                       |  1 +
 resources/sass/map.scss                       |  4 +++
 resources/sass/techniques.scss                |  5 +++
 8 files changed, 61 insertions(+), 5 deletions(-)
 create mode 100644 database/migrations/2023_07_28_095933_tech_title_icons.php

diff --git a/app/Models/Technique.php b/app/Models/Technique.php
index 4469671..2eb0a94 100644
--- a/app/Models/Technique.php
+++ b/app/Models/Technique.php
@@ -32,6 +32,7 @@ class Technique extends Model
 		'index' => 'boolean',
 		'requirements' => 'array',
 		'rulesets' => 'array',
+		'title_icons' => 'array',
 	];
 
 	protected $with = [
diff --git a/database/migrations/2023_07_28_095933_tech_title_icons.php b/database/migrations/2023_07_28_095933_tech_title_icons.php
new file mode 100644
index 0000000..8314b0e
--- /dev/null
+++ b/database/migrations/2023_07_28_095933_tech_title_icons.php
@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+	/**
+	 * Run the migrations.
+	 *
+	 * @return void
+	 */
+	public function up()
+	{
+		Schema::table('techniques', function(Blueprint $table) {
+			$table->text('title_icons')->nullable()->default(null);
+		});
+	}
+
+	/**
+	 * Reverse the migrations.
+	 *
+	 * @return void
+	 */
+	public function down()
+	{
+		Schema::table('techniques', function(Blueprint $table) {
+			$table->dropColumn('title_icons');
+		});
+	}
+};
diff --git a/resources/js/components/common/ZeldaIcon.js b/resources/js/components/common/ZeldaIcon.js
index 067dfbc..9194cde 100644
--- a/resources/js/components/common/ZeldaIcon.js
+++ b/resources/js/components/common/ZeldaIcon.js
@@ -88,14 +88,17 @@ const ZeldaIcon = ({ name }) => {
 
 	const invert = name.startsWith('not-');
 	const strippedName = invert ? name.substr(4) : name;
+	const src = getIconURL(strippedName);
 	const title = t(`icon.zelda.${name}`);
 
 	return <span className="zelda-icon">
-		<img
-			alt={title}
-			src={getIconURL(strippedName)}
-			title={title}
-		/>
+		{src ?
+			<img
+				alt={title}
+				src={src}
+				title={title}
+			/>
+		: null}
 		{invert ?
 			<span className="strike">
 				<Icon.SLASH title="" />
diff --git a/resources/js/components/map/Popover.js b/resources/js/components/map/Popover.js
index 02d4070..7fbbcef 100644
--- a/resources/js/components/map/Popover.js
+++ b/resources/js/components/map/Popover.js
@@ -3,6 +3,8 @@ import React from 'react';
 import { Card, ListGroup } from 'react-bootstrap';
 import { Link } from 'react-router-dom';
 
+import ZeldaIcon from '../common/ZeldaIcon';
+
 import {
 	getLink,
 	getRelations,
@@ -35,6 +37,13 @@ const Popover = ({ show, technique }) =>
 							title={getTranslation(r, 'short', i18n.language)}
 						>
 							<Link to={getLink(r)}>
+								{r.title_icons ?
+									<span className="tech-title-icons">
+										{r.title_icons.map(icon =>
+											<ZeldaIcon key={icon} name={icon} />
+										)}
+									</span>
+								: null}
 								{getTranslation(r, 'title', i18n.language)}
 							</Link>
 						</ListGroup.Item>
diff --git a/resources/js/i18n/de.js b/resources/js/i18n/de.js
index 58732c5..ae88eaa 100644
--- a/resources/js/i18n/de.js
+++ b/resources/js/i18n/de.js
@@ -423,6 +423,7 @@ export default {
 				moonpearl: 'Moonpearl',
 				mushroom: 'Mushroom',
 				'not-flippers': 'Keine Flippers',
+				'not-mirror': 'Kein Mirror',
 				'not-moonpearl': 'Keine Moonpearl',
 				powder: 'Powder',
 				quake: 'Quake',
diff --git a/resources/js/i18n/en.js b/resources/js/i18n/en.js
index 8976017..dc84f67 100644
--- a/resources/js/i18n/en.js
+++ b/resources/js/i18n/en.js
@@ -423,6 +423,7 @@ export default {
 				moonpearl: 'Moonpearl',
 				mushroom: 'Mushroom',
 				'not-flippers': 'No Flippers',
+				'not-mirror': 'No Mirror',
 				'not-moonpearl': 'No Moonpearl',
 				powder: 'Powder',
 				quake: 'Quake',
diff --git a/resources/sass/map.scss b/resources/sass/map.scss
index 3f8ae06..78c9a2b 100644
--- a/resources/sass/map.scss
+++ b/resources/sass/map.scss
@@ -15,6 +15,10 @@
 	&.hidden {
 		display: none;
 	}
+
+	.tech-title-icons {
+		margin-right: 1ex;
+	}
 }
 
 .pin-list {
diff --git a/resources/sass/techniques.scss b/resources/sass/techniques.scss
index eff0c62..55e3c7c 100644
--- a/resources/sass/techniques.scss
+++ b/resources/sass/techniques.scss
@@ -61,6 +61,11 @@
 	}
 }
 
+.tech-title-icons {
+	display: inline-flex;
+	vertical-align: middle;
+}
+
 .tech-outline {
 	float: right;
 }
-- 
2.39.2