Add click on rows

sidebar/stolen-data-cluster.scss

@@ -2,7 +2,7 @@
 
 .stolen-data-cluster-container {
     .domains-container {
-        padding-top: 1rem;
+        padding-top: 0.5rem;
         display: flex;
         flex-flow: column;
         border-bottom: none;
@@ -32,7 +32,7 @@
     table {
         width: 100%;
         position: relative;
-        left: -2px;
+        left: -1px;
         text-align: left;
         font-size: 0.75rem;
         font-family: 'Fira Code';
@@ -116,6 +116,7 @@
             font-weight: 600;
             padding: 0.5rem 0;
             text-align: left;
+            cursor: default;
             font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
                 Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
                 sans-serif;
@@ -124,12 +125,15 @@
                 background: #fff;
             }
         }
+
         .checkbox {
-            // background: red;
-            // width: 1rem;
             position: relative;
             top: 1px;
             width: 0.875rem;
+
+            input {
+                cursor: pointer;
+            }
         }
     }
 }

sidebar/stolen-data-cluster.tsx

@@ -12,8 +12,10 @@ const MAX_STRING_VALUE_LENGTH = 100;
 
 function StolenDataValue({
     entry,
+    refresh,
 }: {
     entry: StolenDataEntry;
+    refresh: Function;
     prefixKey?: string;
 }) {
     const [version] = useEmitter(entry);
@@ -32,8 +34,10 @@ function StolenDataValue({
             className="value"
             onClick={(e) => {
                 entry.toggleMark();
+                refresh();
                 e.stopPropagation();
             }}
+            title={maskString(entry.value, 1, MAX_STRING_VALUE_LENGTH)}
             // style={{ color: entry.isMarked ? 'black' : 'gray' }}
         >
             {body}
@@ -66,8 +70,7 @@ function StolenDataRow({
                 />
             </td>
             <th
-                // className={`${entry.isMarked ? 'toggled' : 'untoggled'}`}
-                title={'Źródło: ' + entry.source}
+                title={`Nazwa: ${entry.name}\nŹródło: ${entry.source}`}
                 onClick={() => {
                     entry.toggleMark();
                     refresh();
@@ -119,7 +122,7 @@ function StolenDataRow({
             </td>
             {/* <td style={{ wordWrap: 'anywhere' as any }}> */}
 
-            <StolenDataValue entry={entry} />
+            <StolenDataValue refresh={refresh} entry={entry} />
         </tr>
     );
 }

sidebar/stolen-data.tsx

@@ -83,7 +83,7 @@ export function StolenData({
                     Zaznacz automatycznie
                 </button> */}
 
-            <span>Domeny otrzymujące informacje</span>
+            <span>Domeny, które pozyskały informacje</span>
 
             {clusters.map((cluster) => {
                 return (