chore: adding some validation and code cleanup

raaymax · Jan 26, 2024 · cad1c1a · cad1c1a
1 parent 932c187
commit cad1c1a
Show file tree

Hide file tree

Showing 7 changed files with 111 additions and 820 deletions.
diff --git a/packages/app/package.json b/packages/app/package.json
@@ -13,6 +13,7 @@
     "@quack/config": "workspace:*",
     "@quack/rpc": "workspace:*",
     "fuse.js": "7.0.0",
+    "prop-types": "15.8.1",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-redux": "9.0.4",

diff --git a/packages/app/src/js/components/ChannelInline/ChannelInline.jsx b/packages/app/src/js/components/ChannelInline/ChannelInline.jsx
@@ -1,6 +1,7 @@
 import { useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import styled from 'styled-components';
+import PropTypes from 'prop-types';
 
 const InlineChannelLink = styled.a`
   span {
@@ -26,3 +27,7 @@ export const ChannelInline = ({ channelId: id }) => {
     </InlineChannelLink>
   );
 };
+
+ChannelInline.propTypes = {
+  channelId: PropTypes.string,
+};
diff --git a/packages/app/src/js/components/Channels/elements/inlineChannel.jsx b/packages/app/src/js/components/Channels/elements/inlineChannel.jsx
@@ -1,5 +1,6 @@
 import styled from 'styled-components';
 import {Badge} from './badge';
+import PropTypes from 'prop-types';
 
 const Container = styled.div`
  padding: 5px 5px 5px 20px; 
@@ -38,3 +39,12 @@ export const InlineChannel = ({
     {badge > 0 && <Badge>{badge}</Badge>}
   </Container>
 )
+
+InlineChannel.propTypes = {
+  id: PropTypes.string,
+  children: PropTypes.any,
+  badge: PropTypes.number,
+  className: PropTypes.string,
+  onClick: PropTypes.func,
+  icon: PropTypes.string,
+};
diff --git a/packages/app/src/js/components/Emoji/Emoji.jsx b/packages/app/src/js/components/Emoji/Emoji.jsx
@@ -2,6 +2,7 @@ import styled from 'styled-components';
 import { getUrl } from '../../services/file';
 import { Tooltip } from '../../elements/tooltip';
 import { useEmoji } from '../../hooks';
+import PropTypes from 'prop-types';
 
 const StyledEmoji = styled.span`
   img{
@@ -19,15 +20,20 @@ const StyledEmoji = styled.span`
 export const Emoji = ({ shortname, big }) => {
   const emoji = useEmoji(shortname);
 
-  if (!emoji || emoji.empty) return <span className='emoji' emoji={shortname}>{shortname}</span>;
+  if (!emoji || emoji.empty) return <span className='emoji'>{shortname}</span>;
 
   return (
     <Tooltip text={shortname}>
-      <StyledEmoji big={big} emoji={shortname}>
+      <StyledEmoji big={big} data-emoji={shortname}>
         {emoji.unicode
           ? <span>{String.fromCodePoint(parseInt(emoji.unicode, 16))}</span>
           : <img src={getUrl(emoji.fileId)} alt={shortname} />}
       </StyledEmoji>
     </Tooltip>
   );
 };
+
+Emoji.propTypes = {
+  shortname: PropTypes.string,
+  big: PropTypes.bool,
+};
diff --git a/packages/app/src/js/services/init.js b/packages/app/src/js/services/init.js
@@ -2,7 +2,6 @@
 import { initNotifications } from './notifications';
 
 const initApp = () => async (dispatch, getState) => {
-  console.log('initApp');
   const {actions, methods} = dispatch;
   if (navigator?.userAgentData?.mobile) {
     document.body.setAttribute('class', 'mobile');

diff --git a/packages/app/src/js/services/notifications.js b/packages/app/src/js/services/notifications.js
@@ -21,10 +21,13 @@ export const initNotifications = async (config) => {
 };
 
 const register = async (config, retry = false) => navigator.serviceWorker.getRegistration('/')
-  .then((registration) => registration.pushManager.subscribe({
-    userVisibleOnly: true,
-    applicationServerKey: config.vapidPublicKey,
-  }))
+  .then((registration) => {
+    if (!registration) throw new Error('No service worker registered');
+    return registration.pushManager.subscribe({
+      userVisibleOnly: true,
+      applicationServerKey: config.vapidPublicKey,
+    })
+  })
   .then(async (subscription) => client.req({
     type: 'user:push:subscribe',
     ...subscription.toJSON(),