Merge pull request #18 from nextcloud-gmbh/feature/10/composition

Improved composing view
2018-11-21 19:09:07 -01:00 · 2018-11-21 19:09:07 -01:00 · 493a200657
commit 493a200657
--- a/.gitignore
+++ b/.gitignore
@ -2,3 +2,4 @@ js/
 \.idea/
 node_modules/
 vendor/
+img/twemoji/
--- a/1
+++ b/1
@ -2,6 +2,7 @@ all: dev-setup lint build-js-production test

 # Dev env management
 dev-setup: clean clean-dev npm-init composer
+	cp -R node_modules/twemoji/2/svg img/twemoji

 npm-init:
 	npm install
--- a/lib/Controller/LocalController.php
+++ b/lib/Controller/LocalController.php
@ -35,6 +35,7 @@ use daita\MySmallPhpTools\Traits\Nextcloud\TNCDataResponse;
 use Exception;
 use OCA\Social\AppInfo\Application;
 use OCA\Social\Exceptions\InvalidResourceException;
+use OCA\Social\Exceptions\RequestException;
 use OCA\Social\Model\Post;
 use OCA\Social\Service\ActivityPub\FollowService;
 use OCA\Social\Service\ActivityPub\NoteService;
@ -228,10 +229,17 @@ class LocalController extends Controller {
 	 * @return DataResponse
 	 */
 	public function accountsSearch(string $search): DataResponse {
+		/* Look for an exactly matching account */
+		$match = null;
+		try {
+			$match = $this->personService->getFromAccount($search);
+		} catch (Exception $e) {
+		}
+
 		try {
 			$accounts = $this->personService->searchCachedAccounts($search);

-			return $this->success(['accounts' => $accounts]);
+			return $this->success(['accounts' => $accounts, 'exact' => $match]);
 		} catch (Exception $e) {
 			return $this->fail($e);
 		}
--- a/lib/Service/ActivityPub/PersonService.php
+++ b/lib/Service/ActivityPub/PersonService.php
@ -162,6 +162,9 @@ class PersonService implements ICoreService {
 			$actor = $this->cacheActorsRequest->getFromAccount($account);
 		} catch (CacheActorDoesNotExistException $e) {
 			$object = $this->instanceService->retrieveAccount($account);
+			if ($object === null) {
+				throw new InvalidResourceException();
+			}
 			$actor = new Person();
 			$actor->import($object);

--- a/lib/Service/CurlService.php
+++ b/lib/Service/CurlService.php
@ -73,7 +73,10 @@ class CurlService {
 //		$this->parseRequestResultCode500($code);
 //		$this->parseRequestResult($result);

-		$ret = json_decode($result, true);
+		$ret = json_decode((string)$result, true);
+		if ($ret === null) {
+			throw new RequestException('500 Internal server error - could not parse JSON response');
+		}
 		if (!is_array($ret)) {
 			$ret = ['_result' => $result];
 		}
--- a/lib/Service/InstanceService.php
+++ b/lib/Service/InstanceService.php
@ -83,6 +83,10 @@ class InstanceService {

 		list($username, $host) = explode('@', $account);

+		if ($username === null || $host === null) {
+			return;
+		}
+
 		$request = new Request('/.well-known/webfinger');
 		$request->addData('resource', 'acct:' . $account);
 		$request->setAddress($host);
--- a/package-lock.json
+++ b/package-lock.json
@ -1101,12 +1101,6 @@
 			"integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM=",
 			"dev": true
 		},
-		"amdefine": {
-			"version": "1.0.1",
-			"resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
-			"integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU=",
-			"dev": true
-		},
 		"ansi-escapes": {
 			"version": "3.1.0",
 			"resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.1.0.tgz",
@ -1438,16 +1432,6 @@
 			"integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw==",
 			"dev": true
 		},
-		"are-we-there-yet": {
-			"version": "1.1.5",
-			"resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz",
-			"integrity": "sha512-5hYdAkZlcG8tOLujVDTgCT+uPX0VnpAH28gWsLfzpXYm7wP6mp5Q/gYyR7YQ0cKVJcXJnl3j2kpBan13PtQf6w==",
-			"dev": true,
-			"requires": {
-				"delegates": "^1.0.0",
-				"readable-stream": "^2.0.6"
-			}
-		},
 		"argparse": {
 			"version": "1.0.10",
 			"resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
@ -1596,12 +1580,6 @@
 			"integrity": "sha1-GdOGodntxufByF04iu28xW0zYC0=",
 			"dev": true
 		},
-		"async-foreach": {
-			"version": "0.1.3",
-			"resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
-			"integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI=",
-			"dev": true
-		},
 		"async-limiter": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.0.tgz",
@ -2219,15 +2197,6 @@
 			"integrity": "sha512-DYWGk01lDcxeS/K9IHPGWfT8PsJmbXRtRd2Sx72Tnb8pcYZQFF1oSDb8hJtS1vhp212q1Rzi5dUf9+nq0o9UIg==",
 			"dev": true
 		},
-		"block-stream": {
-			"version": "0.0.9",
-			"resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
-			"integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo=",
-			"dev": true,
-			"requires": {
-				"inherits": "~2.0.0"
-			}
-		},
 		"bluebird": {
 			"version": "3.5.2",
 			"resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.2.tgz",
@ -2499,24 +2468,6 @@
 			"integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=",
 			"dev": true
 		},
-		"camelcase-keys": {
-			"version": "2.1.0",
-			"resolved": "http://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
-			"integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
-			"dev": true,
-			"requires": {
-				"camelcase": "^2.0.0",
-				"map-obj": "^1.0.0"
-			},
-			"dependencies": {
-				"camelcase": {
-					"version": "2.1.1",
-					"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
-					"integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8=",
-					"dev": true
-				}
-			}
-		},
 		"caniuse-api": {
 			"version": "1.6.1",
 			"resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz",
@ -2890,35 +2841,6 @@
 			"integrity": "sha1-2jCcwmPfFZlMaIypAheco8fNfH4=",
 			"dev": true
 		},
-		"clone-deep": {
-			"version": "2.0.2",
-			"resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-2.0.2.tgz",
-			"integrity": "sha512-SZegPTKjCgpQH63E+eN6mVEEPdQBOUzjyJm5Pora4lrwWRFS8I0QAxV/KD6vV/i0WuijHZWQC1fMsPEdxfdVCQ==",
-			"dev": true,
-			"requires": {
-				"for-own": "^1.0.0",
-				"is-plain-object": "^2.0.4",
-				"kind-of": "^6.0.0",
-				"shallow-clone": "^1.0.0"
-			},
-			"dependencies": {
-				"for-own": {
-					"version": "1.0.0",
-					"resolved": "https://registry.npmjs.org/for-own/-/for-own-1.0.0.tgz",
-					"integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs=",
-					"dev": true,
-					"requires": {
-						"for-in": "^1.0.1"
-					}
-				},
-				"kind-of": {
-					"version": "6.0.2",
-					"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
-					"integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA==",
-					"dev": true
-				}
-			}
-		},
 		"clone-regexp": {
 			"version": "1.0.1",
 			"resolved": "https://registry.npmjs.org/clone-regexp/-/clone-regexp-1.0.1.tgz",
@ -3117,12 +3039,6 @@
 				"date-now": "^0.1.4"
 			}
 		},
-		"console-control-strings": {
-			"version": "1.1.0",
-			"resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
-			"integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=",
-			"dev": true
-		},
 		"consolidate": {
 			"version": "0.15.1",
 			"resolved": "https://registry.npmjs.org/consolidate/-/consolidate-0.15.1.tgz",
@ -3653,12 +3569,6 @@
 			"integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
 			"dev": true
 		},
-		"delegates": {
-			"version": "1.0.0",
-			"resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
-			"integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o=",
-			"dev": true
-		},
 		"des.js": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz",
@ -5367,18 +5277,6 @@
 				}
 			}
 		},
-		"fstream": {
-			"version": "1.0.11",
-			"resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
-			"integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE=",
-			"dev": true,
-			"requires": {
-				"graceful-fs": "^4.1.2",
-				"inherits": "~2.0.0",
-				"mkdirp": ">=0.5 0",
-				"rimraf": "2"
-			}
-		},
 		"function-bind": {
 			"version": "1.1.1",
 			"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
@ -5391,65 +5289,12 @@
 			"integrity": "sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc=",
 			"dev": true
 		},
-		"gauge": {
-			"version": "2.7.4",
-			"resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
-			"integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
-			"dev": true,
-			"requires": {
-				"aproba": "^1.0.3",
-				"console-control-strings": "^1.0.0",
-				"has-unicode": "^2.0.0",
-				"object-assign": "^4.1.0",
-				"signal-exit": "^3.0.0",
-				"string-width": "^1.0.1",
-				"strip-ansi": "^3.0.1",
-				"wide-align": "^1.1.0"
-			},
-			"dependencies": {
-				"is-fullwidth-code-point": {
-					"version": "1.0.0",
-					"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-					"integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
-					"dev": true,
-					"requires": {
-						"number-is-nan": "^1.0.0"
-					}
-				},
-				"string-width": {
-					"version": "1.0.2",
-					"resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-					"integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
-					"dev": true,
-					"requires": {
-						"code-point-at": "^1.0.0",
-						"is-fullwidth-code-point": "^1.0.0",
-						"strip-ansi": "^3.0.0"
-					}
-				}
-			}
-		},
-		"gaze": {
-			"version": "1.1.3",
-			"resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.3.tgz",
-			"integrity": "sha512-BRdNm8hbWzFzWHERTrejLqwHDfS4GibPoq5wjTPIoJHoBtKGPg3xAFfxmM+9ztbXelxcf2hwQcaz1PtmFeue8g==",
-			"dev": true,
-			"requires": {
-				"globule": "^1.0.0"
-			}
-		},
 		"get-caller-file": {
 			"version": "1.0.3",
 			"resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.3.tgz",
 			"integrity": "sha512-3t6rVToeoZfYSGd8YoLFR2DJkiQrIiUrGcjvFX2mDw3bn6k2OtwHN0TNCLbBO+w8qTvimhDkv+LSscbJY1vE6w==",
 			"dev": true
 		},
-		"get-stdin": {
-			"version": "4.0.1",
-			"resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
-			"integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
-			"dev": true
-		},
 		"get-stream": {
 			"version": "3.0.0",
 			"resolved": "http://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
@ -5536,17 +5381,6 @@
 			"integrity": "sha1-L0SUrIkZ43Z8XLtpHp9GMyQoXUM=",
 			"dev": true
 		},
-		"globule": {
-			"version": "1.2.1",
-			"resolved": "https://registry.npmjs.org/globule/-/globule-1.2.1.tgz",
-			"integrity": "sha512-g7QtgWF4uYSL5/dn71WxubOrS7JVGCnFPEnoeChJmBnyR9Mw8nGoEwOgJL/RC2Te0WhbsEUCejfH8SZNJ+adYQ==",
-			"dev": true,
-			"requires": {
-				"glob": "~7.1.1",
-				"lodash": "~4.17.10",
-				"minimatch": "~3.0.2"
-			}
-		},
 		"gonzales-pe": {
 			"version": "4.2.3",
 			"resolved": "https://registry.npmjs.org/gonzales-pe/-/gonzales-pe-4.2.3.tgz",
@ -5642,12 +5476,6 @@
 			"integrity": "sha1-uhqPGvKg/DllD1yFA2dwQSIGO0Q=",
 			"dev": true
 		},
-		"has-unicode": {
-			"version": "2.0.1",
-			"resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
-			"integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk=",
-			"dev": true
-		},
 		"has-value": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/has-value/-/has-value-1.0.0.tgz",
@ -5909,21 +5737,6 @@
 			"integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o=",
 			"dev": true
 		},
-		"in-publish": {
-			"version": "2.0.0",
-			"resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
-			"integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E=",
-			"dev": true
-		},
-		"indent-string": {
-			"version": "2.1.0",
-			"resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
-			"integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA=",
-			"dev": true,
-			"requires": {
-				"repeating": "^2.0.0"
-			}
-		},
 		"indexes-of": {
 			"version": "1.0.1",
 			"resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
@ -7241,24 +7054,12 @@
 			"integrity": "sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg==",
 			"dev": true
 		},
-		"lodash.assign": {
-			"version": "4.2.0",
-			"resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz",
-			"integrity": "sha1-DZnzzNem0mHRm9rrkkUAXShYCOc=",
-			"dev": true
-		},
 		"lodash.camelcase": {
 			"version": "4.3.0",
 			"resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
 			"integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY=",
 			"dev": true
 		},
-		"lodash.clonedeep": {
-			"version": "4.5.0",
-			"resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
-			"integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=",
-			"dev": true
-		},
 		"lodash.debounce": {
 			"version": "4.0.8",
 			"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@ -7276,24 +7077,12 @@
 			"resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.1.tgz",
 			"integrity": "sha512-AOYza4+Hf5z1/0Hztxpm2/xiPZgi/cjMqdnKTUWTBSKchJlxXXuUSxCCl8rJlf4g6yww/j6mA8nC8Hw/EZWxKQ=="
 		},
-		"lodash.mergewith": {
-			"version": "4.6.1",
-			"resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.1.tgz",
-			"integrity": "sha512-eWw5r+PYICtEBgrBE5hhlT6aAa75f411bgDz/ZL2KZqYV03USvucsxcHUIlGTDTECs1eunpI7HOV7U+WLDvNdQ==",
-			"dev": true
-		},
 		"lodash.sortby": {
 			"version": "4.7.0",
 			"resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
 			"integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=",
 			"dev": true
 		},
-		"lodash.tail": {
-			"version": "4.1.1",
-			"resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
-			"integrity": "sha1-0jM6NtnncXyK0vfKyv7HwytERmQ=",
-			"dev": true
-		},
 		"lodash.unescape": {
 			"version": "4.0.1",
 			"resolved": "https://registry.npmjs.org/lodash.unescape/-/lodash.unescape-4.0.1.tgz",
@ -7527,36 +7316,10 @@
 				"readable-stream": "^2.0.1"
 			}
 		},
-		"meow": {
-			"version": "3.7.0",
-			"resolved": "http://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
-			"integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs=",
-			"dev": true,
-			"requires": {
-				"camelcase-keys": "^2.0.0",
-				"decamelize": "^1.1.2",
-				"loud-rejection": "^1.0.0",
-				"map-obj": "^1.0.1",
-				"minimist": "^1.1.3",
-				"normalize-package-data": "^2.3.4",
-				"object-assign": "^4.0.1",
-				"read-pkg-up": "^1.0.1",
-				"redent": "^1.0.0",
-				"trim-newlines": "^1.0.0"
-			},
-			"dependencies": {
-				"minimist": {
-					"version": "1.2.0",
-					"resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-					"integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
-					"dev": true
-				}
-			}
-		},
 		"merge": {
-			"version": "1.2.0",
-			"resolved": "https://registry.npmjs.org/merge/-/merge-1.2.0.tgz",
-			"integrity": "sha1-dTHjnUlJwoGma4xabgJl6LBYlNo=",
+			"version": "1.2.1",
+			"resolved": "https://registry.npmjs.org/merge/-/merge-1.2.1.tgz",
+			"integrity": "sha512-VjFo4P5Whtj4vsLzsYBu5ayHhoHJ0UqNm7ibvShmbmoz7tGi0vXaoJbGdB+GmDMLUdg8DpQXEIeVDAe8MaABvQ==",
 			"dev": true
 		},
 		"merge-source-map": {
@ -7767,24 +7530,6 @@
 				}
 			}
 		},
-		"mixin-object": {
-			"version": "2.0.1",
-			"resolved": "https://registry.npmjs.org/mixin-object/-/mixin-object-2.0.1.tgz",
-			"integrity": "sha1-T7lJRB2rGCVA8f4DW6YOGUel5X4=",
-			"dev": true,
-			"requires": {
-				"for-in": "^0.1.3",
-				"is-extendable": "^0.1.1"
-			},
-			"dependencies": {
-				"for-in": {
-					"version": "0.1.8",
-					"resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz",
-					"integrity": "sha1-2Hc5COMSVhCZUrH9ubP6hn0ndeE=",
-					"dev": true
-				}
-			}
-		},
 		"mkdirp": {
 			"version": "0.5.1",
 			"resolved": "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
@ -7823,7 +7568,8 @@
 			"version": "2.11.1",
 			"resolved": "https://registry.npmjs.org/nan/-/nan-2.11.1.tgz",
 			"integrity": "sha512-iji6k87OSXa0CcrLl9z+ZiYSuR2o+c0bGuNmXdrhTQTakxytAFsC56SArGYoiHlJlFoHSnvmhpceZJaXkVuOtA==",
-			"dev": true
+			"dev": true,
+			"optional": true
 		},
 		"nanomatch": {
 			"version": "1.2.13",
@ -7923,43 +7669,6 @@
 				}
 			}
 		},
-		"node-gyp": {
-			"version": "3.8.0",
-			"resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.8.0.tgz",
-			"integrity": "sha512-3g8lYefrRRzvGeSowdJKAKyks8oUpLEd/DyPV4eMhVlhJ0aNaZqIrNUIPuEWWTAoPqyFkfGrM67MC69baqn6vA==",
-			"dev": true,
-			"requires": {
-				"fstream": "^1.0.0",
-				"glob": "^7.0.3",
-				"graceful-fs": "^4.1.2",
-				"mkdirp": "^0.5.0",
-				"nopt": "2 || 3",
-				"npmlog": "0 || 1 || 2 || 3 || 4",
-				"osenv": "0",
-				"request": "^2.87.0",
-				"rimraf": "2",
-				"semver": "~5.3.0",
-				"tar": "^2.0.0",
-				"which": "1"
-			},
-			"dependencies": {
-				"nopt": {
-					"version": "3.0.6",
-					"resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz",
-					"integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k=",
-					"dev": true,
-					"requires": {
-						"abbrev": "1"
-					}
-				},
-				"semver": {
-					"version": "5.3.0",
-					"resolved": "http://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
-					"integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
-					"dev": true
-				}
-			}
-		},
 		"node-int64": {
 			"version": "0.4.0",
 			"resolved": "https://registry.npmjs.org/node-int64/-/node-int64-0.4.0.tgz",
@ -8026,70 +7735,6 @@
 				"semver": "^5.3.0"
 			}
 		},
-		"node-sass": {
-			"version": "4.9.4",
-			"resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.9.4.tgz",
-			"integrity": "sha512-MXyurANsUoE4/6KmfMkwGcBzAnJQ5xJBGW7Ei6ea8KnUKuzHr/SguVBIi3uaUAHtZCPUYkvlJ3Ef5T5VAwVpaA==",
-			"dev": true,
-			"requires": {
-				"async-foreach": "^0.1.3",
-				"chalk": "^1.1.1",
-				"cross-spawn": "^3.0.0",
-				"gaze": "^1.0.0",
-				"get-stdin": "^4.0.1",
-				"glob": "^7.0.3",
-				"in-publish": "^2.0.0",
-				"lodash.assign": "^4.2.0",
-				"lodash.clonedeep": "^4.3.2",
-				"lodash.mergewith": "^4.6.0",
-				"meow": "^3.7.0",
-				"mkdirp": "^0.5.1",
-				"nan": "^2.10.0",
-				"node-gyp": "^3.8.0",
-				"npmlog": "^4.0.0",
-				"request": "^2.88.0",
-				"sass-graph": "^2.2.4",
-				"stdout-stream": "^1.4.0",
-				"true-case-path": "^1.0.2"
-			},
-			"dependencies": {
-				"ansi-styles": {
-					"version": "2.2.1",
-					"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-					"integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
-					"dev": true
-				},
-				"chalk": {
-					"version": "1.1.3",
-					"resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-					"integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-					"dev": true,
-					"requires": {
-						"ansi-styles": "^2.2.1",
-						"escape-string-regexp": "^1.0.2",
-						"has-ansi": "^2.0.0",
-						"strip-ansi": "^3.0.0",
-						"supports-color": "^2.0.0"
-					}
-				},
-				"cross-spawn": {
-					"version": "3.0.1",
-					"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
-					"integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
-					"dev": true,
-					"requires": {
-						"lru-cache": "^4.0.1",
-						"which": "^1.2.9"
-					}
-				},
-				"supports-color": {
-					"version": "2.0.0",
-					"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-					"integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
-					"dev": true
-				}
-			}
-		},
 		"nopt": {
 			"version": "4.0.1",
 			"resolved": "https://registry.npmjs.org/nopt/-/nopt-4.0.1.tgz",
@ -8154,18 +7799,6 @@
 				"path-key": "^2.0.0"
 			}
 		},
-		"npmlog": {
-			"version": "4.1.2",
-			"resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
-			"integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
-			"dev": true,
-			"requires": {
-				"are-we-there-yet": "~1.1.2",
-				"console-control-strings": "~1.1.0",
-				"gauge": "~2.7.3",
-				"set-blocking": "~2.0.0"
-			}
-		},
 		"num2fraction": {
 			"version": "1.2.2",
 			"resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz",
@ -9920,16 +9553,6 @@
 				"util.promisify": "^1.0.0"
 			}
 		},
-		"redent": {
-			"version": "1.0.0",
-			"resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz",
-			"integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94=",
-			"dev": true,
-			"requires": {
-				"indent-string": "^2.1.0",
-				"strip-indent": "^1.0.1"
-			}
-		},
 		"reduce-css-calc": {
 			"version": "1.3.0",
 			"resolved": "http://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
@ -10653,163 +10276,6 @@
 				}
 			}
 		},
-		"sass-graph": {
-			"version": "2.2.4",
-			"resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.4.tgz",
-			"integrity": "sha1-E/vWPNHK8JCLn9k0dq1DpR0eC0k=",
-			"dev": true,
-			"requires": {
-				"glob": "^7.0.0",
-				"lodash": "^4.0.0",
-				"scss-tokenizer": "^0.2.3",
-				"yargs": "^7.0.0"
-			},
-			"dependencies": {
-				"camelcase": {
-					"version": "3.0.0",
-					"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-					"integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo=",
-					"dev": true
-				},
-				"cliui": {
-					"version": "3.2.0",
-					"resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-					"integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
-					"dev": true,
-					"requires": {
-						"string-width": "^1.0.1",
-						"strip-ansi": "^3.0.1",
-						"wrap-ansi": "^2.0.0"
-					}
-				},
-				"is-fullwidth-code-point": {
-					"version": "1.0.0",
-					"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-					"integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
-					"dev": true,
-					"requires": {
-						"number-is-nan": "^1.0.0"
-					}
-				},
-				"os-locale": {
-					"version": "1.4.0",
-					"resolved": "http://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
-					"integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
-					"dev": true,
-					"requires": {
-						"lcid": "^1.0.0"
-					}
-				},
-				"string-width": {
-					"version": "1.0.2",
-					"resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-					"integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
-					"dev": true,
-					"requires": {
-						"code-point-at": "^1.0.0",
-						"is-fullwidth-code-point": "^1.0.0",
-						"strip-ansi": "^3.0.0"
-					}
-				},
-				"which-module": {
-					"version": "1.0.0",
-					"resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
-					"integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8=",
-					"dev": true
-				},
-				"yargs": {
-					"version": "7.1.0",
-					"resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
-					"integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg=",
-					"dev": true,
-					"requires": {
-						"camelcase": "^3.0.0",
-						"cliui": "^3.2.0",
-						"decamelize": "^1.1.1",
-						"get-caller-file": "^1.0.1",
-						"os-locale": "^1.4.0",
-						"read-pkg-up": "^1.0.1",
-						"require-directory": "^2.1.1",
-						"require-main-filename": "^1.0.1",
-						"set-blocking": "^2.0.0",
-						"string-width": "^1.0.2",
-						"which-module": "^1.0.0",
-						"y18n": "^3.2.1",
-						"yargs-parser": "^5.0.0"
-					}
-				},
-				"yargs-parser": {
-					"version": "5.0.0",
-					"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
-					"integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo=",
-					"dev": true,
-					"requires": {
-						"camelcase": "^3.0.0"
-					}
-				}
-			}
-		},
-		"sass-loader": {
-			"version": "7.1.0",
-			"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-7.1.0.tgz",
-			"integrity": "sha512-+G+BKGglmZM2GUSfT9TLuEp6tzehHPjAMoRRItOojWIqIGPloVCMhNIQuG639eJ+y033PaGTSjLaTHts8Kw79w==",
-			"dev": true,
-			"requires": {
-				"clone-deep": "^2.0.1",
-				"loader-utils": "^1.0.1",
-				"lodash.tail": "^4.1.1",
-				"neo-async": "^2.5.0",
-				"pify": "^3.0.0",
-				"semver": "^5.5.0"
-			},
-			"dependencies": {
-				"pify": {
-					"version": "3.0.0",
-					"resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-					"integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
-					"dev": true
-				}
-			}
-		},
-		"sass-resources-loader": {
-			"version": "1.3.4",
-			"resolved": "https://registry.npmjs.org/sass-resources-loader/-/sass-resources-loader-1.3.4.tgz",
-			"integrity": "sha512-/vTIDdR8GYb3+6KzbbaTwTsMDq4a4/jx1p4z6yT4lC485x0cbEe/Qe2+es6ayNrMH/udJwN0qY3I6q/3J2gYHQ==",
-			"dev": true,
-			"requires": {
-				"async": "^2.1.4",
-				"chalk": "^1.1.3",
-				"glob": "^7.1.1",
-				"loader-utils": "^1.0.4"
-			},
-			"dependencies": {
-				"ansi-styles": {
-					"version": "2.2.1",
-					"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-					"integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
-					"dev": true
-				},
-				"chalk": {
-					"version": "1.1.3",
-					"resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-					"integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-					"dev": true,
-					"requires": {
-						"ansi-styles": "^2.2.1",
-						"escape-string-regexp": "^1.0.2",
-						"has-ansi": "^2.0.0",
-						"strip-ansi": "^3.0.0",
-						"supports-color": "^2.0.0"
-					}
-				},
-				"supports-color": {
-					"version": "2.0.0",
-					"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-					"integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
-					"dev": true
-				}
-			}
-		},
 		"sax": {
 			"version": "1.2.4",
 			"resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
@ -10835,27 +10301,6 @@
 				"ajv": "^5.0.0"
 			}
 		},
-		"scss-tokenizer": {
-			"version": "0.2.3",
-			"resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
-			"integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
-			"dev": true,
-			"requires": {
-				"js-base64": "^2.1.8",
-				"source-map": "^0.4.2"
-			},
-			"dependencies": {
-				"source-map": {
-					"version": "0.4.4",
-					"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-					"integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
-					"dev": true,
-					"requires": {
-						"amdefine": ">=0.0.4"
-					}
-				}
-			}
-		},
 		"semver": {
 			"version": "5.6.0",
 			"resolved": "https://registry.npmjs.org/semver/-/semver-5.6.0.tgz",
@ -10913,25 +10358,6 @@
 				"safe-buffer": "^5.0.1"
 			}
 		},
-		"shallow-clone": {
-			"version": "1.0.0",
-			"resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-1.0.0.tgz",
-			"integrity": "sha512-oeXreoKR/SyNJtRJMAKPDSvd28OqEwG4eR/xc856cRGBII7gX9lvAqDxusPm0846z/w/hWYjI1NpKwJ00NHzRA==",
-			"dev": true,
-			"requires": {
-				"is-extendable": "^0.1.1",
-				"kind-of": "^5.0.0",
-				"mixin-object": "^2.0.1"
-			},
-			"dependencies": {
-				"kind-of": {
-					"version": "5.1.0",
-					"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
-					"integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw==",
-					"dev": true
-				}
-			}
-		},
 		"shebang-command": {
 			"version": "1.2.0",
 			"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
@ -11264,15 +10690,6 @@
 				}
 			}
 		},
-		"stdout-stream": {
-			"version": "1.4.1",
-			"resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.1.tgz",
-			"integrity": "sha512-j4emi03KXqJWcIeF8eIXkjMFN1Cmb8gUlDYGeBALLPo5qdyTfA9bOtl8m33lRoC+vFMkP3gl0WsDr6+gzxbbTA==",
-			"dev": true,
-			"requires": {
-				"readable-stream": "^2.0.1"
-			}
-		},
 		"stealthy-require": {
 			"version": "1.1.1",
 			"resolved": "https://registry.npmjs.org/stealthy-require/-/stealthy-require-1.1.1.tgz",
@ -11423,15 +10840,6 @@
 			"integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=",
 			"dev": true
 		},
-		"strip-indent": {
-			"version": "1.0.1",
-			"resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz",
-			"integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI=",
-			"dev": true,
-			"requires": {
-				"get-stdin": "^4.0.1"
-			}
-		},
 		"strip-json-comments": {
 			"version": "2.0.1",
 			"resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
@ -11724,38 +11132,6 @@
 				"stylelint-config-recommended": "^2.0.0"
 			}
 		},
-		"stylelint-scss": {
-			"version": "3.3.2",
-			"resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-3.3.2.tgz",
-			"integrity": "sha512-0x+nD1heoMJYOfi3FfGcz3Hrwhcm+Qyq+BuvoBv5v9xrZZ1aziRXQauuhjwb87gWAa9MBzxhfUqBnvTUrHlLjA==",
-			"dev": true,
-			"requires": {
-				"lodash": "^4.17.10",
-				"postcss-media-query-parser": "^0.2.3",
-				"postcss-resolve-nested-selector": "^0.1.1",
-				"postcss-selector-parser": "^4.0.0",
-				"postcss-value-parser": "^3.3.0"
-			},
-			"dependencies": {
-				"cssesc": {
-					"version": "1.0.1",
-					"resolved": "https://registry.npmjs.org/cssesc/-/cssesc-1.0.1.tgz",
-					"integrity": "sha512-S2hzrpWvE6G/rW7i7IxJfWBYn27QWfOIncUW++8Rbo1VB5zsJDSVPcnI+Q8z7rhxT6/yZeLOCja4cZnghJrNGA==",
-					"dev": true
-				},
-				"postcss-selector-parser": {
-					"version": "4.0.0",
-					"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-4.0.0.tgz",
-					"integrity": "sha512-5h+MvEjnzu1qy6MabjuoPatsGAjjDV9B24e7Cktjl+ClNtjVjmvAXjOFQr1u7RlWULKNGYaYVE4s+DIIQ4bOGA==",
-					"dev": true,
-					"requires": {
-						"cssesc": "^1.0.1",
-						"indexes-of": "^1.0.1",
-						"uniq": "^1.0.1"
-					}
-				}
-			}
-		},
 		"stylelint-webpack-plugin": {
 			"version": "0.10.5",
 			"resolved": "https://registry.npmjs.org/stylelint-webpack-plugin/-/stylelint-webpack-plugin-0.10.5.tgz",
@ -12137,17 +11513,6 @@
 			"integrity": "sha512-IlqtmLVaZA2qab8epUXbVWRn3aB1imbDMJtjB3nu4X0NqPkcY/JH9ZtCBWKHWPxs8Svi9tyo8w2dBoi07qZbBA==",
 			"dev": true
 		},
-		"tar": {
-			"version": "2.2.1",
-			"resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
-			"integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE=",
-			"dev": true,
-			"requires": {
-				"block-stream": "*",
-				"fstream": "^1.0.2",
-				"inherits": "2"
-			}
-		},
 		"test-exclude": {
 			"version": "4.2.3",
 			"resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-4.2.3.tgz",
@ -12294,18 +11659,17 @@
 				"punycode": "^2.1.0"
 			}
 		},
+		"tributejs": {
+			"version": "3.4.0",
+			"resolved": "https://registry.npmjs.org/tributejs/-/tributejs-3.4.0.tgz",
+			"integrity": "sha512-BWB2YvfKpa6hZgcP9hKN5/tH3P/Guspn4r+ePgwNpftnQwMb6GVWTUgBpkMtVXkR5dwLLcP/iW87i9C1mp21zQ=="
+		},
 		"trim": {
 			"version": "0.0.1",
 			"resolved": "https://registry.npmjs.org/trim/-/trim-0.0.1.tgz",
 			"integrity": "sha1-WFhUf2spB1fulczMZm+1AITEYN0=",
 			"dev": true
 		},
-		"trim-newlines": {
-			"version": "1.0.0",
-			"resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
-			"integrity": "sha1-WIeWa7WCpFA6QetST301ARgVphM=",
-			"dev": true
-		},
 		"trim-right": {
 			"version": "1.0.1",
 			"resolved": "https://registry.npmjs.org/trim-right/-/trim-right-1.0.1.tgz",
@ -12324,15 +11688,6 @@
 			"integrity": "sha512-fwkLWH+DimvA4YCy+/nvJd61nWQQ2liO/nF/RjkTpiOGi+zxZzVkhb1mvbHIIW4b/8nDsYI8uTmAlc0nNkRMOw==",
 			"dev": true
 		},
-		"true-case-path": {
-			"version": "1.0.3",
-			"resolved": "https://registry.npmjs.org/true-case-path/-/true-case-path-1.0.3.tgz",
-			"integrity": "sha512-m6s2OdQe5wgpFMC+pAJ+q9djG82O2jcHPOI6RNg1yy9rCYR+WD6Nbpl32fDpfC56nirdRy+opFa/Vk7HYhqaew==",
-			"dev": true,
-			"requires": {
-				"glob": "^7.1.2"
-			}
-		},
 		"tsconfig": {
 			"version": "7.0.0",
 			"resolved": "https://registry.npmjs.org/tsconfig/-/tsconfig-7.0.0.tgz",
@ -12380,6 +11735,11 @@
 			"integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
 			"dev": true
 		},
+		"twemoji": {
+			"version": "11.2.0",
+			"resolved": "https://registry.npmjs.org/twemoji/-/twemoji-11.2.0.tgz",
+			"integrity": "sha512-DgTadXkRHugun6mjUf1k3ni04WC4jHOX1bN5MjuCM3nwRyIMdXIr8FmWzW5mEIZjht5jD3NaEyXC4j3POdQwyQ=="
+		},
 		"type-check": {
 			"version": "0.3.2",
 			"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
@ -12894,6 +12254,16 @@
 			"resolved": "https://registry.npmjs.org/vue-click-outside/-/vue-click-outside-1.0.7.tgz",
 			"integrity": "sha1-zdKxYF48SUR4TheU6uShKg9wC9Y="
 		},
+		"vue-contenteditable-directive": {
+			"version": "1.2.0",
+			"resolved": "https://registry.npmjs.org/vue-contenteditable-directive/-/vue-contenteditable-directive-1.2.0.tgz",
+			"integrity": "sha512-9RuW1cboQBOUhURXiQpBD8XldyK2BYWhkWTnRw4Qmv8ZeQy+tGnnPs4XfemoPNf4KQW31Mx6UqEszlZYgoPeYw=="
+		},
+		"vue-emoji-picker": {
+			"version": "1.0.1",
+			"resolved": "https://registry.npmjs.org/vue-emoji-picker/-/vue-emoji-picker-1.0.1.tgz",
+			"integrity": "sha512-phisHAaSg+7xnpi7xlOxFGD46npaQXCLit2T6nAHMlEcFNT1ZUqu/NO3P5FDp6RgjP7o4ueduktnxk9ul0IS9Q=="
+		},
 		"vue-eslint-parser": {
 			"version": "2.0.3",
 			"resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-2.0.3.tgz",
@ -12991,6 +12361,16 @@
 			"integrity": "sha512-x3LV3wdmmERhVCYy3quqA57NJW7F3i6faas++pJQWtknWT+n7k30F4TVdHvCLn48peTJFRvCpxs3UuFPqgeELg==",
 			"dev": true
 		},
+		"vue-tribute": {
+			"version": "1.0.1",
+			"resolved": "https://registry.npmjs.org/vue-tribute/-/vue-tribute-1.0.1.tgz",
+			"integrity": "sha1-ThJfdoEjxUBd4izjQ4NqmaCVRz0="
+		},
+		"vue-twemoji": {
+			"version": "1.0.1",
+			"resolved": "https://registry.npmjs.org/vue-twemoji/-/vue-twemoji-1.0.1.tgz",
+			"integrity": "sha512-vKdA9vZuV0ADB8O2qCah//nGv9seb+S1hMTwU6IhPmmOsax4EHqwzyXSTf7kr3jCobsQIBBtNg2bpuRYoxalAA=="
+		},
 		"vue2-datepicker": {
 			"version": "2.6.2",
 			"resolved": "https://registry.npmjs.org/vue2-datepicker/-/vue2-datepicker-2.6.2.tgz",
@ -13688,15 +13068,6 @@
 			"integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=",
 			"dev": true
 		},
-		"wide-align": {
-			"version": "1.1.3",
-			"resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz",
-			"integrity": "sha512-QGkOQc8XL6Bt5PwnsExKBPuMKBxnGxWWW3fU55Xt4feHozMUhdUMaBCk290qpm/wG5u/RSKzwdAC4i51YigihA==",
-			"dev": true,
-			"requires": {
-				"string-width": "^1.0.2 || 2"
-			}
-		},
 		"wordwrap": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
--- a/package.json
+++ b/package.json
@ -31,11 +31,17 @@
 		"linkifyjs": "^2.1.7",
 		"nextcloud-axios": "^0.1.2",
 		"nextcloud-vue": "^0.4.2",
+		"tributejs": "^3.3.5",
+		"twemoji": "^11.2.0",
 		"uuid": "^3.3.2",
 		"vue": "^2.5.16",
 		"vue-click-outside": "^1.0.7",
+		"vue-contenteditable-directive": "^1.2.0",
+		"vue-emoji-picker": "^1.0.1",
 		"vue-infinite-loading": "^2.4.1",
 		"vue-router": "^3.0.1",
+		"vue-tribute": "^1.0.1",
+		"vue-twemoji": "^1.0.1",
 		"vuex": "^3.0.1",
 		"vuex-router-sync": "^5.0.0"
 	},
@ -69,14 +75,10 @@
 		"jest": "^23.6.0",
 		"jest-serializer-vue": "^2.0.2",
 		"mini-css-extract-plugin": "^0.4.4",
-		"node-sass": "^4.9.4",
 		"prettier-eslint": "^8.8.2",
 		"raw-loader": "^0.5.1",
-		"sass-loader": "^7.0.3",
-		"sass-resources-loader": "^1.3.4",
 		"stylelint": "^8.4.0",
 		"stylelint-config-recommended-scss": "^3.2.0",
-		"stylelint-scss": "^3.3.2",
 		"stylelint-webpack-plugin": "^0.10.5",
 		"vue-jest": "^2.6.0",
 		"vue-loader": "^15.4.2",
--- a/src/components/Composer.vue
+++ b/src/components/Composer.vue
@ -0,0 +1,443 @@
+<!--
+  - @copyright Copyright (c) 2018 Julius Härtl <jus@bitgrid.net>
+  -
+  - @author Julius Härtl <jus@bitgrid.net>
+  -
+  - @license GNU AGPL version 3 or any later version
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License as
+  - published by the Free Software Foundation, either version 3 of the
+  - License, or (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License
+  - along with this program. If not, see <http://www.gnu.org/licenses/>.
+  -
+  -->
+
+<template>
+	<div class="new-post" data-id="">
+		<div class="new-post-author">
+			<avatar :user="currentUser.uid" :display-name="currentUser.displayName" :size="32" />
+		</div>
+		<form class="new-post-form" @submit.prevent="createPost">
+			<div class="author currentUser">
+				{{ currentUser.displayName }}
+
+				<span class="social-id">{{ socialId }}</span>
+			</div>
+			<vue-tribute :options="tributeOptions">
+				<!-- eslint-disable-next-line vue/valid-v-model -->
+				<div v-contenteditable:post.dangerousHTML="canType" ref="composerInput" class="message"
+					placeholder="Share a thought…" @keyup.enter="keyup" />
+			</vue-tribute>
+			<emoji-picker :search="search" class="emoji-picker-wrapper" @emoji="insert">
+				<div v-tooltip="'Insert emoji'" slot="emoji-invoker" slot-scope="{ events }"
+					class="emoji-invoker" v-on="events" />
+				<div slot="emoji-picker" slot-scope="{ emojis, insert, display }" class="emoji-picker popovermenu">
+					<div>
+						<div>
+							<input v-model="search" type="text">
+						</div>
+						<div>
+							<div v-for="(emojiGroup, category) in emojis" :key="category">
+								<h5>{{ category }}</h5>
+								<div>
+									<span v-for="(emoji, emojiName) in emojiGroup" :key="emojiName" :title="emojiName"
+										class="emoji" @click="insert(emoji)" v-html="$twemoji.parse(emoji)" />
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</emoji-picker>
+
+			<div class="options">
+				<input :value="t('social', 'Post')" :disabled="post.length < 1" class="submit primary"
+					type="submit" title="" data-original-title="Post">
+				<div>
+					<button :class="currentVisibilityIconClass" @click="togglePopoverMenu" />
+					<div :class="{open: menuOpened}" class="popovermenu">
+						<PopoverMenu :menu="visibilityPopover" />
+					</div>
+				</div>
+			</div>
+		</form>
+	</div>
+</template>
+<style scoped>
+	.new-post {
+		display: flex;
+		flex-wrap: wrap;
+		padding: 10px;
+		background-color: var(--color-main-background);
+		position: sticky;
+		top: 47px;
+		z-index: 100;
+		margin-bottom: 10px;
+	}
+	.new-post-author {
+		padding: 5px;
+	}
+
+	.new-post-form {
+		flex-grow: 1;
+		position: relative;
+	}
+
+	.message {
+		width: 100%;
+		padding-right: 44px;
+		min-height: 70px;
+	}
+
+	.author .social-id {
+		opacity: .5;
+	}
+
+	[contenteditable=true]:empty:before{
+		content: attr(placeholder);
+		display: block; /* For Firefox */
+		opacity: .5;
+	}
+
+	input[type=submit].inline {
+		width: 44px;
+		height: 44px;
+		margin: 0;
+		padding: 13px;
+		background-color: transparent;
+		border: none;
+		opacity: 0.3;
+		position: absolute;
+		bottom: 0;
+		right: 0;
+	}
+	.options {
+		display: flex;
+		align-items: flex-end;
+		width: 100%;
+		flex-direction: row-reverse;
+	}
+
+	.options > div {
+		position: relative;
+	}
+
+	.options button {
+		width: 34px;
+		height: 34px;
+	}
+
+	.emoji-invoker {
+		background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2OCIgaGVpZ2h0PSI2OCI+PHBhdGggZD0iTTM0IDBDMTUuMyAwIDAgMTUuMyAwIDM0czE1LjMgMzQgMzQgMzQgMzQtMTUuMyAzNC0zNFM1Mi43IDAgMzQgMHptMCA2NEMxNy41IDY0IDQgNTAuNSA0IDM0UzE3LjUgNCAzNCA0czMwIDEzLjUgMzAgMzAtMTMuNSAzMC0zMCAzMHoiLz48cGF0aCBkPSJNNDQuNiA0NC42Yy01LjggNS44LTE1LjQgNS44LTIxLjIgMC0uOC0uOC0yLS44LTIuOCAwLS44LjgtLjggMiAwIDIuOEMyNC4zIDUxLjEgMjkuMSA1MyAzNCA1M3M5LjctMS45IDEzLjQtNS42Yy44LS44LjgtMiAwLTIuOC0uOC0uOC0yLS44LTIuOCAweiIvPjxjaXJjbGUgcj0iNSIgY3k9IjI2IiBjeD0iMjQiLz48Y2lyY2xlIHI9IjUiIGN5PSIyNiIgY3g9IjQ0Ii8+PC9zdmc+);
+		background-position: center center;
+		background-repeat: no-repeat;
+		width: 38px;
+		opacity: 0.5;
+		background-size: 16px 16px;
+		height: 38px;
+		cursor: pointer;
+	}
+	.emoji-picker-wrapper {
+		position: absolute;
+		right: 0;
+		top: 22px;
+	}
+	.emoji-picker.popovermenu {
+		display: block;
+		padding: 5px;
+		width: 200px;
+		height: 200px;
+	}
+	.emoji-picker > div {
+		overflow: hidden;
+		overflow-y: scroll;
+		height: 190px;
+	}
+	.emoji-picker input {
+		width: 100%;
+	}
+	.emoji-picker .emoji img {
+		margin: 3px;
+		width: 16px;
+	}
+</style>
+<style>
+	/* Tribute-specific styles TODO: properly scope component css */
+	.tribute-container {
+		position: absolute;
+		top: 0;
+		left: 0;
+		height: auto;
+		max-height: 300px;
+		max-width: 500px;
+		min-width: 200px;
+		overflow: auto;
+		display: block;
+		z-index: 999999;
+		border-radius: 4px;
+		box-shadow: 0 1px 3px var(--color-box-shadow);
+	}
+	.tribute-container ul {
+		margin: 0;
+		margin-top: 2px;
+		padding: 0;
+		list-style: none;
+		background: var(--color-main-background);
+		border-radius: 4px;
+		background-clip: padding-box;
+		overflow: hidden;
+	}
+	.tribute-container li {
+		color: var(--color-text);
+		padding: 5px 10px;
+		cursor: pointer;
+		font-size: 14px;
+		display: flex;
+	}
+	.tribute-container li span {
+		display: block;
+	}
+	.tribute-container li.highlight,
+	.tribute-container li:hover {
+		background: var(--color-primary);
+		color: var(--color-primary-text);
+	}
+	.tribute-container li img {
+		width: 32px;
+		height: 32px;
+		border-radius: 50%;
+		overflow: hidden;
+		margin-right: 10px;
+		margin-left: -3px;
+		margin-top: 3px;
+	}
+	.tribute-container li span {
+		font-weight: bold;
+	}
+	.tribute-container li.no-match {
+		cursor: default;
+	}
+	.tribute-container .menu-highlighted {
+		font-weight: bold;
+	}
+
+	.tribute-container .account,
+	.tribute-container li.highlight .account,
+	.tribute-container li:hover .account {
+		font-weight: normal;
+		color: var(--color-text-light);
+		opacity: 0.5;
+	}
+	.tribute-container li.highlight .account,
+	.tribute-container li:hover .account {
+		color: var(--color-primary-text) !important;
+		opacity: .6;
+	}
+	.message .mention {
+		color: var(--color-primary-element);
+		background-color: var(--color-background-dark);
+		border-radius: 5px;
+		padding-top: 1px;
+		padding-left: 2px;
+		padding-bottom: 1px;
+		padding-right: 5px;
+	}
+	.mention img {
+		width: 16px;
+		border-radius: 50%;
+		overflow: hidden;
+		margin-right: 3px;
+		vertical-align: middle;
+		margin-top: -1px;
+	}
+	img.emoji {
+		margin: 3px;
+		width: 16px;
+		vertical-align: text-bottom;
+	}
+</style>
+<script>
+
+import { Avatar, PopoverMenu } from 'nextcloud-vue'
+import EmojiPicker from 'vue-emoji-picker'
+import VueTribute from 'vue-tribute'
+import { VTooltip } from 'v-tooltip'
+import CurrentUserMixin from './../mixins/currentUserMixin'
+import axios from 'nextcloud-axios'
+
+export default {
+	name: 'Composer',
+	components: {
+		PopoverMenu,
+		Avatar,
+		EmojiPicker,
+		VueTribute
+	},
+	directives: {
+		tooltip: VTooltip
+	},
+	mixins: [CurrentUserMixin],
+	props: {
+
+	},
+	data() {
+		return {
+			type: 'public',
+			post: '',
+			canType: true,
+			search: '',
+			tributeOptions: {
+				lookup: function(item) {
+					return item.key + item.value
+				},
+				menuItemTemplate: function(item) {
+					return '<img src="' + item.original.avatar + '" /><div>'
+						+ '<span class="displayName">' + item.original.key + '</span>'
+						+ '<span class="account">' + item.original.value + '</span>'
+						+ '</div>'
+				},
+				selectTemplate: function(item) {
+					return '<span class="mention" contenteditable="false">'
+						+ '<a href="' + item.original.url + '" target="_blank"><img src="' + item.original.avatar + '" />@' + item.original.value + '</a></span>'
+				},
+				values: (text, cb) => {
+					this.remoteSearch(text).then((result) => {
+						let users = []
+						if (result.data.result.exact) {
+							let user = result.data.result.exact
+							users.push({
+								key: user.preferredUsername,
+								value: user.account,
+								url: user.url,
+								avatar: 'http://localhost:8000/index.php/avatar/admin/32?v=0' // TODO: use real avatar from server
+							})
+						}
+						for (var i in result.data.result.accounts) {
+							let user = result.data.result.accounts[i]
+							users.push({
+								key: user.preferredUsername,
+								value: user.account,
+								url: user.url,
+								avatar: 'http://localhost:8000/index.php/avatar/admin/32?v=0' // TODO: use real avatar from server
+							})
+						}
+						cb(users)
+					})
+				}
+			},
+			menuOpened: false
+
+		}
+	},
+	computed: {
+		currentVisibilityIconClass() {
+			return this.visibilityIconClass(this.type)
+		},
+		visibilityIconClass() {
+			return (type) => {
+				if (typeof type === 'undefined') {
+					type = this.type
+				}
+				switch (type) {
+				case 'public':
+					return 'icon-link'
+				case 'followers':
+					return 'icon-contacts-dark'
+				case 'direct':
+					return 'icon-external'
+				case 'unlisted':
+					return 'icon-password'
+				}
+			}
+		},
+		visibilityPopover() {
+			return [
+				{
+					action: () => { this.switchType('public') },
+					icon: this.visibilityIconClass('public'),
+					text: t('social', 'Public'),
+					longtext: t('social', 'Post to public timelines')
+				},
+				{
+					action: () => { this.switchType('direct') },
+					icon: this.visibilityIconClass('direct'),
+					text: t('social', 'Direct'),
+					longtext: t('social', 'Post to mentioned users only')
+				},
+				{
+					action: () => { this.switchType('followers') },
+					icon: this.visibilityIconClass('followers'),
+					text: t('social', 'Followers'),
+					longtext: t('social', 'Post to followers only')
+				},
+				{
+					action: () => { this.switchType('unlisted') },
+					icon: this.visibilityIconClass('unlisted'),
+					text: t('social', 'Unlisted'),
+					longtext: t('social', 'Do not post to public timelines')
+				}
+			]
+		}
+	},
+	methods: {
+		insert(emoji) {
+			this.post += this.$twemoji.parse(emoji)
+			this.$refs.composerInput.innerHTML = this.post
+		},
+		togglePopoverMenu() {
+			this.menuOpened = !this.menuOpened
+		},
+		switchType(type) {
+			this.type = type
+			this.menuOpened = false
+		},
+		getPostData() {
+			let element = this.$refs.composerInput.cloneNode(true)
+			Array.from(element.getElementsByClassName('emoji')).forEach((emoji) => {
+				var em = document.createTextNode(emoji.getAttribute('alt'))
+				emoji.replaceWith(em)
+			})
+			let to = []
+			const re = /@((\w+)(@[\w.]+)?)/g
+			let match = null
+			do {
+				match = re.exec(element.innerText)
+				if (match) {
+					to.push(match[1])
+				}
+			} while (match)
+			let content = element.innerText.trim()
+			return {
+				content: content,
+				to: to,
+				type: this.type
+			}
+		},
+		keyup(event) {
+			if (event.shiftKey) {
+				this.createPost(event)
+			}
+		},
+		createPost(event) {
+			this.$store.dispatch('post', this.getPostData()).then((response) => {
+				this.post = ''
+				this.$refs.composerInput.innerText = this.post
+				this.$store.dispatch('refreshTimeline', {
+					account: this.currentUser.uid
+				})
+			})
+		},
+		remoteSearch(text) {
+			return axios.get(OC.generateUrl('apps/social/api/v1/accounts/search?search=' + text))
+		}
+	}
+}
+
+</script>
--- a/src/main.js
+++ b/src/main.js
@ -27,6 +27,8 @@ import { sync } from 'vuex-router-sync'
 import App from './App'
 import store from './store'
 import router from './router'
+import vuetwemoji from 'vue-twemoji'
+import contenteditableDirective from 'vue-contenteditable-directive'

 sync(store, router)

@ -44,6 +46,14 @@ Vue.prototype.n = n
 Vue.prototype.OC = OC
 Vue.prototype.OCA = OCA

+Vue.use(contenteditableDirective)
+Vue.use(vuetwemoji, {
+	baseUrl: OC.linkTo('social', 'img/'), // can set to local folder of emojis. default: https://twemoji.maxcdn.com/
+	extension: '.svg', // .svg, .png
+	className: 'emoji', // custom className for image output
+	size: 'twemoji' // image size
+})
+
 /* eslint-disable-next-line no-new */
 new Vue({
 	router: router,
--- a/src/mixins/currentUserMixin.js
+++ b/src/mixins/currentUserMixin.js
@ -0,0 +1,32 @@
+/*
+ * @copyright Copyright (c) 2018 Julius Härtl <jus@bitgrid.net>
+ *
+ * @author Julius Härtl <jus@bitgrid.net>
+ *
+ * @license GNU AGPL version 3 or any later version
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+export default {
+	computed: {
+		currentUser: function() {
+			return OC.getCurrentUser()
+		},
+		socialId: function() {
+			return '@' + OC.getCurrentUser().uid + '@' + OC.getHost()
+		}
+	}
+}
--- a/src/store/timeline.js
+++ b/src/store/timeline.js
@ -21,34 +21,47 @@
 */

 import axios from 'nextcloud-axios'
+import Vue from 'vue'

 const state = {
-	timeline: [],
+	timeline: {},
 	since: new Date()
 }
 const mutations = {
 	addToTimeline(state, data) {
 		for (let item in data) {
 			state.since = data[item].published
-			state.timeline.push(data[item])
+			Vue.set(state.timeline, data[item].id, data[item])
 		}
+	},
+	addPost(state, data) {
+		// FIXME: push data we receive to the timeline array
+		// state.timeline.push(data)
 	}
 }
 const getters = {
 	getTimeline(state) {
-		return state.timeline
+		return Object.values(state.timeline).sort(function(a, b) {
+			return b.publishedTime - a.publishedTime
+		})
 	}
 }
 const actions = {
 	post(context, post) {
-		axios.post(OC.generateUrl('apps/social/api/v1/post')).then((response) => {
-			// FIXME: post composition is done in #18
-			let uid = ''
-			context.commit('addPost', { uid: uid, data: response.data })
+		return axios.post(OC.generateUrl('apps/social/api/v1/post'), { data: post }).then((response) => {
+			context.commit('addPost', { data: response.data })
+		}).catch((error) => {
+			OC.Notification.showTemporary('Failed to create a post')
+			console.error('Failed to create a post', error)
 		})
 	},
-	fetchTimeline(context, account) {
-		const sinceTimestamp = Date.parse(state.since) / 1000
+	refreshTimeline(context, account) {
+		return this.dispatch('fetchTimeline', { account: account, sinceTimestamp: Math.floor(Date.now() / 1000) + 1 })
+	},
+	fetchTimeline(context, { account, sinceTimestamp }) {
+		if (typeof sinceTimestamp === 'undefined') {
+			sinceTimestamp = Date.parse(state.since) / 1000
+		}
 		return axios.get(OC.generateUrl('apps/social/api/v1/timeline?limit=5&since=' + sinceTimestamp)).then((response) => {
 			if (response.status === -1) {
 				throw response.message
--- a/src/views/Timeline.vue
+++ b/src/views/Timeline.vue
@ -12,21 +12,7 @@
 				</div>
 			</transition>
 			<div class="social__timeline">
-				<div class="new-post" data-id="">
-					<div class="new-post-author">
-						<avatar :user="currentUser.uid" :display-name="currentUser.displayName" :size="32" />
-					</div>
-					<form class="new-post-form">
-						<div class="author currentUser">
-							{{ currentUser.displayName }}
-							<span class="social-id">{{ socialId }}</span>
-						</div>
-						<div contenteditable="true" class="message" placeholder="Share a thought…" />
-						<input class="submit icon-confirm has-tooltip" type="submit" value=""
-							title="" data-original-title="Post">
-						<div class="submitLoading icon-loading-small hidden" />
-					</form>
-				</div>
+				<composer />
 				<timeline-entry v-for="entry in timeline" :item="entry" :key="entry.id" />
 				<infinite-loading ref="infiniteLoading" @infinite="infiniteHandler">
 					<div slot="spinner"><div class="icon-loading" /></div>
@ -90,46 +76,6 @@
 		margin: 15px auto;
 	}

-	.new-post {
-		display: flex;
-		padding: 10px;
-		background-color: var(--color-main-background-translucent);
-		position: sticky;
-		top: 47px;
-		z-index: 100;
-		margin-bottom: 10px;
-	}
-	.new-post-author {
-		padding: 5px;
-	}
-	.author .social-id {
-		opacity: .5;
-	}
-	.new-post-form {
-		flex-grow: 1;
-		position: relative;
-	}
-	.message {
-		width: 100%;
-	}
-	[contenteditable=true]:empty:before{
-		content: attr(placeholder);
-		display: block; /* For Firefox */
-		opacity: .5;
-	}
-	input[type=submit] {
-		width: 44px;
-		height: 44px;
-		margin: 0;
-		padding: 13px;
-		background-color: transparent;
-		border: none;
-		opacity: 0.3;
-		position: absolute;
-		bottom: 0;
-		right: 0;
-	}
-
 	#app-content {
 		position: relative;
 	}
@ -153,11 +99,12 @@
 import {
 	PopoverMenu,
 	AppNavigation,
-	Multiselect,
-	Avatar
+	Multiselect
 } from 'nextcloud-vue'
 import InfiniteLoading from 'vue-infinite-loading'
 import TimelineEntry from './../components/TimelineEntry'
+import Composer from './../components/Composer'
+import CurrentUserMixin from './../mixins/currentUserMixin'

 export default {
 	name: 'Timeline',
@ -166,9 +113,10 @@ export default {
 		AppNavigation,
 		TimelineEntry,
 		Multiselect,
-		Avatar,
+		Composer,
 		InfiniteLoading
 	},
+	mixins: [CurrentUserMixin],
 	data: function() {
 		return {
 			infoHidden: false,
@ -179,12 +127,6 @@ export default {
 		url: function() {
 			return OC.linkTo('social', 'img/nextcloud.png')
 		},
-		currentUser: function() {
-			return OC.getCurrentUser()
-		},
-		socialId: function() {
-			return '@' + OC.getCurrentUser().uid + '@' + OC.getHost()
-		},
 		timeline: function() {
 			return this.$store.getters.getTimeline
 		},