Function RelationshipInHtmlTable

src/ui-solid-dom/RelationshipInHtmlTable.tsx:112–183

(
  props: RelationshipInHtmlTableProps & HtmlTableProps,
)

};

export const RelationshipInHtmlTable = (
  props: RelationshipInHtmlTableProps & HtmlTableProps,
): JSXElement => {
  const resolvedRelationships = useRelationshipsOrRelationshipsById(
    () => props.relationships,
  );
  const details = createMemo(() =>
    getRelationshipsStoreTableIds(
      resolvedRelationships(),
      props.relationshipId,
    ),
  );
  const localCellIds = useDottedCellIds(
    () => details()[2],
    () => details()[1],
  );
  const remoteCellIds = useDottedCellIds(
    () => details()[3],
    () => details()[1],
  );
  const cellIds = createMemo(() => [...localCellIds(), ...remoteCellIds()]);
  const cells = useCells(
    cellIds,
    () => props.customCells,
    () => (props.editable ? EditableCellView : CellView),
  );
  const rowIds = useRowIds(
    () => details()[2] as Id,
    () => details()[1],
  );
  const content = () => {
    const [relationships, store, localTableId, remoteTableId] = details();
    const params = getParams(
      props.idColumn ?? true,
      cells,
      localTableId,
      remoteTableId,
      props.relationshipId,
      relationships,
      store,
      props.extraCellsBefore,
      props.extraCellsAfter,
    );
    return (
      <table class={props.className}>
        {isFalse(props.headerRow) ? null : (
          <thead>
            <tr>
              {extraHeaders(props.extraCellsBefore)}
              {isFalse(props.idColumn) ? null : (
                <>
                  <th>{localTableId}.Id</th>
                  <th>{remoteTableId}.Id</th>
                </>
              )}
              {objToArray(cells(), (cell) => (
                <th>{cell.label}</th>
              ))}