refactored component errors

src/components/main/GodRays/index.tsx

@@ -34,6 +34,10 @@ export class GodRays extends React.Component<IGodRaysProps> {
 
     const ctx = this.canvas.getContext('2d');
 
+    if (!ctx) {
+      return;
+    }
+
     ctx.globalCompositeOperation = 'luminosity';
     ctx.clearRect(0, 0, width, height + 100); // clear canvas
     ctx.save();
@@ -123,7 +127,7 @@ export class GodRays extends React.Component<IGodRaysProps> {
     );
   }
 
-  canvas: HTMLCanvasElement;
+  canvas: HTMLCanvasElement | null | undefined;
 
   inc;
 }

src/components/main/Notifications/index.tsx

@@ -42,8 +42,12 @@ const NotificationsUnconnected: FC<IProps> = ({
     (notification: INotification) => {
       switch (notification.type) {
         case 'message':
+          if (!(notification as IMessageNotification)?.content?.from?.username) {
+            return;
+          }
+
           return authOpenProfile(
-            (notification as IMessageNotification).content.from.username,
+            (notification as IMessageNotification).content.from!.username,
             'messages'
           );
         default:
@@ -78,9 +82,6 @@ const NotificationsUnconnected: FC<IProps> = ({
   );
 };
 
-const Notifications = connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(NotificationsUnconnected);
+const Notifications = connect(mapStateToProps, mapDispatchToProps)(NotificationsUnconnected);
 
 export { Notifications };

src/components/main/UserButton/index.tsx

@@ -15,10 +15,12 @@ interface IProps {
 
 const UserButton: FC<IProps> = ({ user: { username, photo }, authOpenProfile, onLogout }) => {
   const onProfileOpen = useCallback(() => {
+    if (!username) return;
     authOpenProfile(username, 'profile');
   }, [authOpenProfile, username]);
 
   const onSettingsOpen = useCallback(() => {
+    if (!username) return;
     authOpenProfile(username, 'settings');
   }, [authOpenProfile, username]);