remove border bottom of the last table item

Author: dukenv0307

src/components/HTMLEngineProvider/HTMLRenderers/TableRowRenderer.tsx

@@ -1,9 +1,24 @@
 import React from 'react';
 import {View} from 'react-native';
-import type {CustomRendererProps, TBlock} from 'react-native-render-html';
+import type {CustomRendererProps, TBlock, TNode} from 'react-native-render-html';
 import {TNodeRenderer} from 'react-native-render-html';
 import useThemeStyles from '@hooks/useThemeStyles';
 
+function getElementChildren(node: TNode | null | undefined): TNode[] {
+    return node?.children?.filter((child) => !!child.tagName) ?? [];
+}
+
+function isLastRowOfTable(tnode: TNode): boolean {
+    const section = tnode.parent;
+    const table = section?.parent;
+    if (!section || !table) {
+        return false;
+    }
+    const sectionRows = getElementChildren(section);
+    const tableSections = getElementChildren(table);
+    return sectionRows[sectionRows.length - 1] === tnode && tableSections[tableSections.length - 1] === section;
+}
+
 function TableRowRenderer({tnode}: CustomRendererProps<TBlock>) {
     const styles = useThemeStyles();
 
@@ -14,7 +29,7 @@ function TableRowRenderer({tnode}: CustomRendererProps<TBlock>) {
     const cells = tnode.children.filter((child) => !!child.tagName);
 
     return (
-        <View style={isHeaderRow ? styles.htmlTableHeaderRow : styles.htmlTableRow}>
+        <View style={[isHeaderRow ? styles.htmlTableHeaderRow : styles.htmlTableRow, isLastRowOfTable(tnode) && styles.htmlTableLastRow]}>
             {cells.map((child, index) => {
                 const key = `${child.tagName ?? 'node'}-${index}`;
                 return (

src/styles/index.ts

@@ -2686,6 +2686,10 @@ const staticStyles = (theme: ThemeColors) =>
             borderColor: theme.border,
         },
 
+        htmlTableLastRow: {
+            borderBottomWidth: 0,
+        },
+
         htmlTableCell: {
             flex: 1,
             minWidth: variables.htmlTableColumnMinWidth,

src/styles/variables.ts

@@ -132,7 +132,7 @@ export default {
     tableRowPaddingVertical: 8,
     tableRowPaddingHorizontal: 12,
     htmlTableRowMinHeight: 40,
-    htmlTableColumnMinWidth: 80,
+    htmlTableColumnMinWidth: 120,
     tableGroupRowPaddingVertical: 4,
     tableGroupRowHeight: 36,
     tableCheckboxColumnWidth: 20,