Add some reactions

locales/en.yml

@@ -18,6 +18,9 @@ common:
     hmm: "Hmm...?"
     surprise: "Wow"
     congrats: "Congrats!"
+    angry: "Angry"
+    confused: "Confused"
+    pudding: "Pudding"
 
   input-message-here: "Enter message here"
   send: "Send"

locales/ja.yml

@@ -18,6 +18,9 @@ common:
     hmm: "ふぅ～む"
     surprise: "わお"
     congrats: "おめでとう"
+    angry: "おこ"
+    confused: "こまこまのこまり"
+    pudding: "Pudding"
 
   input-message-here: "ここにメッセージを入力"
   send: "送信"

src/api/endpoints/posts/reactions/create.ts

@@ -26,7 +26,10 @@ module.exports = (params, user) => new Promise(async (res, rej) => {
 		'laugh',
 		'hmm',
 		'surprise',
-		'congrats'
+		'congrats',
+		'angry',
+		'confused',
+		'pudding'
 	]).$;
 	if (reactionErr) return rej('invalid reaction param');
 

src/web/app/common/tags/reaction-icon.tag

@@ -5,6 +5,10 @@
 	<virtual if={ opts.reaction == 'hmm' }><img src="/assets/reactions/hmm.png" alt="%i18n:common.reactions.hmm%"></virtual>
 	<virtual if={ opts.reaction == 'surprise' }><img src="/assets/reactions/surprise.png" alt="%i18n:common.reactions.surprise%"></virtual>
 	<virtual if={ opts.reaction == 'congrats' }><img src="/assets/reactions/congrats.png" alt="%i18n:common.reactions.congrats%"></virtual>
+	<virtual if={ opts.reaction == 'angry' }><img src="/assets/reactions/angry.png" alt="%i18n:common.reactions.angry%"></virtual>
+	<virtual if={ opts.reaction == 'confused' }><img src="/assets/reactions/confused.png" alt="%i18n:common.reactions.confused%"></virtual>
+	<virtual if={ opts.reaction == 'pudding' }><img src="/assets/reactions/pudding.png" alt="%i18n:common.reactions.pudding%"></virtual>
+
 	<style>
 		:scope
 			display inline

src/web/app/common/tags/reaction-picker.tag

@@ -9,6 +9,9 @@
 			<button onclick={ react.bind(null, 'hmm') } onmouseover={ onmouseover } onmouseout={ onmouseout } tabindex="4" title="%i18n:common.reactions.hmm%"><mk-reaction-icon reaction='hmm'></mk-reaction-icon></button>
 			<button onclick={ react.bind(null, 'surprise') } onmouseover={ onmouseover } onmouseout={ onmouseout } tabindex="5" title="%i18n:common.reactions.surprise%"><mk-reaction-icon reaction='surprise'></mk-reaction-icon></button>
 			<button onclick={ react.bind(null, 'congrats') } onmouseover={ onmouseover } onmouseout={ onmouseout } tabindex="6" title="%i18n:common.reactions.congrats%"><mk-reaction-icon reaction='congrats'></mk-reaction-icon></button>
+			<button onclick={ react.bind(null, 'angry') } onmouseover={ onmouseover } onmouseout={ onmouseout } tabindex="4" title="%i18n:common.reactions.angry%"><mk-reaction-icon reaction='angry'></mk-reaction-icon></button>
+			<button onclick={ react.bind(null, 'confused') } onmouseover={ onmouseover } onmouseout={ onmouseout } tabindex="5" title="%i18n:common.reactions.confused%"><mk-reaction-icon reaction='confused'></mk-reaction-icon></button>
+			<button onclick={ react.bind(null, 'pudding') } onmouseover={ onmouseover } onmouseout={ onmouseout } tabindex="6" title="%i18n:common.reactions.pudding%"><mk-reaction-icon reaction='pudding'></mk-reaction-icon></button>
 		</div>
 	</div>
 	<style>
@@ -76,6 +79,8 @@
 
 				> div
 					padding 4px
+					width 240px
+					text-align center
 
 					> button
 						width 40px