Watch file changes (#5364)

* [my libraries] redesigned 'watch/unwatch file changes'

- added 'watch file changes' & 'unwatch file changes' to the operation
menu
- added icon & tooltip for monitored libraries
- added support for mobile

* [my libs] updated 'watch/unwatch file changes'

* [notifications] update for 'watch/unwatch file changes'

frontend/src/components/icon.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import '../css/icon.css';
+
+const importAll = (requireContext) => {
+  requireContext.keys().forEach(requireContext);
+};
+try {
+  importAll(require.context('../assets/icons', true, /\.svg$/));
+} catch (error) {
+  // eslint-disable-next-line no-console
+  console.log(error);
+}
+
+const Icon = (props) => {
+  const { className, symbol } = props;
+  const iconClass = `seafile-multicolor-icon seafile-multicolor-icon-${symbol} ${className || ''}`;
+  return (
+    <svg className={iconClass}>
+      <use xlinkHref={`#${symbol}`} />
+    </svg>
+  );
+};
+
+Icon.propTypes = {
+  symbol: PropTypes.string.isRequired,
+  className: PropTypes.string,
+};
+
+export default Icon;