identifying code for PR

ui/component/claimPreview/view.jsx

@@ -35,6 +35,7 @@ const AbandonedChannelPreview = lazyImport(() =>
   import('component/abandonedChannelPreview' /* webpackChunkName: "abandonedChannelPreview" */)
 );
 
+// preview images used on the landing page and on the channel page
 type Props = {
   uri: string,
   claim: ?Claim,

ui/component/claimPreviewTile/view.jsx

@@ -53,6 +53,7 @@ type Props = {
   isLivestream: boolean,
 };
 
+// preview image cards used in related video functionality
 function ClaimPreviewTile(props: Props) {
   const {
     history,

ui/component/fileWatchLaterLink/view.jsx

@@ -17,10 +17,7 @@ type Props = {
 function FileWatchLaterLink(props: Props) {
   const { claim, hasClaimInWatchLater, doToast, doCollectionEdit, focusable = true } = props;
   const buttonRef = useRef();
-  console.log('ref');
-  console.log(buttonRef);
   let isHovering = useHover(buttonRef);
-  console.log(isHovering);
 
   if (!claim) {
     return null;
@@ -40,7 +37,10 @@ function FileWatchLaterLink(props: Props) {
     });
   }
 
+  // text that will show if you keep cursor over dic
   const title = hasClaimInWatchLater ? __('Remove from Watch Later') : __('Add to Watch Later');
+
+  // label that is shown after hover
   const label = !hasClaimInWatchLater ? __('Add') : __('Added');
 
   return (

ui/effects/use-hover.js

@@ -9,17 +9,12 @@ export default function useHover(ref) {
   useEffect(() => {
     const refElement = ref.current;
     if (refElement) {
-      // refElement.addEventListener('mouseenter', hoverFunc);
+      refElement.addEventListener('mouseenter', hoverFunc);
-      // refElement.addEventListener('mouseleave', unHoverFunc);
+      refElement.addEventListener('mouseleave', unHoverFunc);
-      // refElement.addEventListener('touchstart', hoverFunc);
-      // refElement.addEventListener('touchmove', unHoverFunc);
-
 
       return () => {
-        // refElement.removeEventListener('mouseenter', hoverFunc);
+        refElement.removeEventListener('mouseenter', hoverFunc);
-        // refElement.removeEventListener('mouseleave', unHoverFunc);
+        refElement.removeEventListener('mouseleave', unHoverFunc);
-        // refElement.removeEventListener('touchstart', hoverFunc);
-        // refElement.removeEventListener('touchmove', unHoverFunc);
       };
     }
   }, [ref, isHovering]);

ui/scss/component/_claim-list.scss

@@ -130,6 +130,7 @@
     @include handleChannelGif(6rem);
   }
 
+  // show watch later button and duration divs when hovered
   &:hover {
     .claim-preview__hover-actions {
       display: block;
@@ -645,6 +646,7 @@
   overflow: hidden;
 }
 
+// show duration and watch later button when hovered
 .claim-preview--tile {
   &:hover {
     .claim-preview__hover-actions {
@@ -672,6 +674,7 @@
   margin-bottom: 0;
 }
 
+// div that displays watch later button
 .claim-preview__hover-actions {
   display: none;
   position: relative;
@@ -703,6 +706,7 @@
       display: none;
     }
 
+    // show the additional watch later text (Add) when hovered
     &:hover {
       .button__label {
         display: inline;