@datagrok/sequence-translator 1.10.21 → 1.10.23

package/src/oligo-renderer/cell-actions.ts

@@ -0,0 +1,178 @@
+/**
+ * Cell-level user actions for OligoNucleotide cells.
+ *
+ * The corresponding decorated entry points live in `package.ts` so the
+ * platform can discover them — those methods are kept thin and forward to
+ * the implementations below. Keeping the logic here means `package.ts` stays
+ * structural and the oligo subsystem stays self-contained.
+ *
+ *   - `openOligoCanvasDialog`       — double-click handler: full-screen modal
+ *     with a hi-res canvas rendering, hover interactions reused from the
+ *     grid cell renderer.
+ *   - `openOligoHelmEditorDialog`   — "Edit HELM" action: HELM Web Editor;
+ *     OK writes the edited HELM back to the cell.
+ *   - `copyHelmToClipboard`         — "Copy as HELM" action.
+ *   - `copyDuplexImageToClipboard`  — "Copy as Image" action: hi-res PNG with
+ *     a transparent background, trimmed to the duplex's natural extent.
+ */
+
+import * as grok from 'datagrok-api/grok';
+import * as ui from 'datagrok-api/ui';
+import * as DG from 'datagrok-api/dg';
+
+import {getHelmHelper} from '@datagrok-libraries/bio/src/helm/helm-helper';
+
+import {parseHelmDuplex} from './helm-parser';
+import {drawDuplex, hitTest, DuplexLayout} from './canvas-renderer';
+import {showMonomerTooltip} from './tooltip';
+
+/** Reference layout dimensions used as the seed for sizing both the dialog
+ * canvas and the clipboard image. Wide enough that any real-world duplex
+ * fits without wrapping; the right edge is trimmed back to the real extent. */
+const REF_W = 1500;
+const REF_H = 120;
+const RIGHT_PAD = 20;
+
+/* -------------------------------------------------------------------------- *
+ * Canvas viewer dialog (double-click on a cell)
+ * -------------------------------------------------------------------------- */
+
+export function openOligoCanvasDialog(cell: DG.GridCell): void {
+  const helm = String(cell.cell?.value ?? '');
+  if (!helm) return;
+  const model = parseHelmDuplex(helm);
+
+  // Probe layout at the reference dimensions so we discover the natural
+  // horizontal extent of this particular duplex (varies with conjugates,
+  // multi-char bases, strand length).
+  const refLayout = drawDuplex(
+    null as unknown as CanvasRenderingContext2D, 0, 0, REF_W, REF_H, model, undefined, true);
+  const trimmedW = Math.max(REF_H, computeMaxChipEndX(refLayout) + RIGHT_PAD);
+
+  // Scale the trimmed layout up to fill the modal — screen width minus 200px.
+  const targetW = Math.max(400, window.innerWidth - 200);
+  const scale = targetW / trimmedW;
+  const finalW = trimmedW * scale; // === targetW by construction
+  const finalH = REF_H * scale;
+
+  // Backing canvas: dimensions in CSS px, pixel-density bumped by devicePixelRatio.
+  const dpr = window.devicePixelRatio || 1;
+  const canvas = document.createElement('canvas');
+  canvas.width = Math.max(1, Math.round(finalW * dpr));
+  canvas.height = Math.max(1, Math.round(finalH * dpr));
+  canvas.style.width = `${finalW}px`;
+  canvas.style.height = `${finalH}px`;
+  canvas.style.display = 'block';
+  const g = canvas.getContext('2d');
+  if (!g) return;
+  g.scale(dpr, dpr);
+  const finalLayout = drawDuplex(g, 0, 0, finalW, finalH, model);
+
+  // Hover support — same hit-test → tooltip pipeline the grid renderer uses,
+  // just with canvas-local coords instead of GridCell.bounds-relative ones.
+  canvas.addEventListener('mousemove', (e) => {
+    const rect = canvas.getBoundingClientRect();
+    const localX = e.clientX - rect.left;
+    const localY = e.clientY - rect.top;
+    const hit = hitTest(localX, localY, model, finalLayout);
+    if (!hit) {
+      ui.tooltip.hide();
+      return;
+    }
+    showMonomerTooltip(hit, e.clientX, e.clientY);
+  });
+  canvas.addEventListener('mouseleave', () => ui.tooltip.hide());
+
+  const container = ui.div([canvas], {style: {
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    width: '100%',
+    height: '100%',
+  }});
+
+  ui.dialog({title: 'Oligonucleotide', showHeader: true, showFooter: false})
+    .add(container)
+    .show({modal: true, fullScreen: true});
+}
+
+/* -------------------------------------------------------------------------- *
+ * HELM Web Editor action ("Edit HELM")
+ * -------------------------------------------------------------------------- */
+
+export async function openOligoHelmEditorDialog(value: DG.SemanticValue): Promise<void> {
+  if (!value?.cell) return;
+  const cell = value.cell;
+  // Helm:editMoleculeCell can't be reused: it calls seqHelper.getSeqHandler(col),
+  // which throws unless semType === Macromolecule. OligoNucleotide columns have
+  // semType=OligoNucleotide, so we drive the HELM Web Editor directly.
+  const helmHelper = await getHelmHelper();
+  const view = ui.div();
+  const app = helmHelper.createWebEditorApp(view, String(cell.value ?? ''));
+  ui.dialog({showHeader: false, showFooter: true})
+    .add(view)
+    .onOK(() => {
+      const helmValue = app.canvas!.getHelm(true)
+        .replace(/<\/span>/g, '')
+        .replace(/<span style='background:#bbf;'>/g, '');
+      cell.value = helmValue;
+    })
+    .show({modal: true, fullScreen: true});
+}
+
+/* -------------------------------------------------------------------------- *
+ * Copy as HELM
+ * -------------------------------------------------------------------------- */
+
+export function copyHelmToClipboard(value: DG.SemanticValue): void {
+  const helm = String(value?.value ?? '');
+  if (!helm) return;
+  navigator.clipboard.writeText(helm).then(() => grok.shell.info('HELM copied to clipboard'));
+}
+
+/* -------------------------------------------------------------------------- *
+ * Copy as Image
+ * -------------------------------------------------------------------------- */
+
+const IMAGE_SCALE = 8;
+
+export function copyDuplexImageToClipboard(value: DG.SemanticValue): void {
+  if (!value?.value) return;
+  const model = parseHelmDuplex(String(value.value));
+
+  // Probe layout at the reference size, then crop the canvas to the natural
+  // duplex extent so the resulting image isn't padded with blank pixels.
+  const refLayout = drawDuplex(
+    null as unknown as CanvasRenderingContext2D, 0, 0, REF_W, REF_H, model, undefined, true);
+  const width = Math.max(REF_H, computeMaxChipEndX(refLayout) + RIGHT_PAD);
+
+  const canvas = document.createElement('canvas');
+  canvas.width = Math.max(1, Math.round((width + RIGHT_PAD) * IMAGE_SCALE));
+  canvas.height = Math.max(1, Math.round(REF_H * IMAGE_SCALE));
+  const g = canvas.getContext('2d');
+  if (!g) return;
+  g.scale(IMAGE_SCALE, IMAGE_SCALE);
+  drawDuplex(g, 0, 0, width, REF_H, model);
+
+  canvas.toBlob((blob) => {
+    if (!blob) return;
+    navigator.clipboard.write([new ClipboardItem({'image/png': blob})])
+      .then(() => grok.shell.info('Image copied to clipboard'))
+      .catch((er) => grok.shell.error(`Failed to copy image: ${er?.message ?? er}`));
+  }, 'image/png');
+}
+
+/* -------------------------------------------------------------------------- *
+ * Internals
+ * -------------------------------------------------------------------------- */
+
+function computeMaxChipEndX(layout: DuplexLayout): number {
+  const lastSense = layout.senseChips.length ?
+    layout.senseChips[layout.senseChips.length - 1] : null;
+  const lastAnti = layout.antiChips.length ?
+    layout.antiChips[layout.antiChips.length - 1] : null;
+  return Math.max(
+    (lastSense?.x ?? 0) + (lastSense?.w ?? 0),
+    (lastAnti?.x ?? 0) + (lastAnti?.w ?? 0),
+  );
+}

package/src/oligo-renderer/legend-panel.ts

@@ -20,6 +20,7 @@ import {
   ParsedNucleotide, resolveConjugate, resolvePhosphate, resolveSugar,
 } from './types';
 import {getNaturalAnalog} from './analog-cache';
+import {getMonomerColors} from './monomer-colors';
 
 export function buildOligoPanel(value: DG.SemanticValue): DG.Widget {
   const helm: string = value.value ?? '';
@@ -110,9 +111,10 @@ function section(title: string, body: HTMLElement): HTMLElement {
 
 /** Build a legend filtered to modifications actually present in this cell.
  * One row per unique mod, with the count to the right. Items collapse by
- * canonical symbol so legacy/canonical aliases share a row. Custom bases
- * (non-A/C/G/U/T HELM symbols) are listed with their natural-analog color
- * — resolved async via the central Bio monomer library. */
+ * canonical symbol so legacy/canonical aliases share a row. Colors come from
+ * the same `getMonomerColors()` path the canvas renderer uses — so what's
+ * drawn on the chip and what's in the legend swatch are always in sync. The
+ * local mod meta only supplies the fallback color and human-readable name. */
 function buildCellLegend(
   sugars: Map<string, number>, phos: Map<string, number>,
   conjs: Map<string, number>, bases: Map<string, number>,
@@ -120,34 +122,39 @@ function buildCellLegend(
   type Item = { label: string; color: string; count: number };
   const items: Item[] = [];
 
-  // Sugar mods — collapse by canonical symbol so e.g. mR + m → one row
+  // Sugars — collapse by canonical symbol so e.g. mR + m → one row. Canonical
+  // ribose/deoxyribose are included too since the canvas now draws a stripe
+  // for every sugar, not just the modified ones.
   const sugarByCanon = new Map<string, number>();
   for (const [sym, n] of sugars.entries()) {
     const c = canonicalSugarSymbol(sym);
-    if (c === 'r' || c === 'd') continue; // unmodified
     sugarByCanon.set(c, (sugarByCanon.get(c) ?? 0) + n);
   }
   for (const [c, n] of sugarByCanon.entries()) {
     const meta = resolveSugar(c, null).meta;
-    items.push({label: meta.name, color: meta.color, count: n});
+    const libColor = getMonomerColors('sugar', c).backgroundcolor;
+    items.push({label: meta.name, color: libColor ?? meta.color, count: n});
   }
 
-  // Phosphate / linkage mods
+  // Phosphate / linkage mods — show ALL linkages used in the cell (including
+  // canonical `p`) since the canvas now draws an apex for every linkage.
   const phosByCanon = new Map<string, number>();
   for (const [sym, n] of phos.entries()) {
     const c = canonicalPhosphateSymbol(sym);
-    if (c === 'p') continue;
     phosByCanon.set(c, (phosByCanon.get(c) ?? 0) + n);
   }
   for (const [c, n] of phosByCanon.entries()) {
     const meta = resolvePhosphate(c).meta;
-    items.push({label: `${meta.name} (linkage)`, color: meta.color, count: n});
+    const libColor = getMonomerColors('linker', c).backgroundcolor;
+    items.push({label: `${meta.name} (linkage)`, color: libColor ?? meta.color, count: n});
   }
 
-  // Custom bases — color via natural analog from the central Bio lib (sync).
+  // Custom bases — prefer the library's base color; fall back to natural-
+  // analog palette and finally to FALLBACK_COLOR.
   for (const [sym, n] of bases.entries()) {
+    const libColor = getMonomerColors('base', sym).backgroundcolor;
     const analog = getNaturalAnalog(sym);
-    const color = (analog && BASE_COLORS[analog]) ? BASE_COLORS[analog] : FALLBACK_COLOR;
+    const color = libColor ?? (analog && BASE_COLORS[analog]) ?? FALLBACK_COLOR;
     const label = analog ? `${sym} (base, analog ${analog})` : `${sym} (base)`;
     items.push({label, color, count: n});
   }
@@ -155,7 +162,8 @@ function buildCellLegend(
   // Conjugates
   for (const [sym, n] of conjs.entries()) {
     const meta = resolveConjugate(sym).meta;
-    items.push({label: meta.name, color: meta.color, count: n});
+    const libColor = getMonomerColors('chem', sym).backgroundcolor;
+    items.push({label: meta.name, color: libColor ?? meta.color, count: n});
   }
 
   if (items.length === 0) {

package/src/oligo-renderer/monomer-colors.ts

@@ -0,0 +1,61 @@
+/**
+ * Synchronous color resolution against the central Bio monomer library.
+ *
+ * `_package.bioMonomerLib` is wired up at package init (see
+ * `initSequenceTranslatorInt`), so by the time any cell renders, the library
+ * is always present. The lib's `getMonomerColors(biotype, symbol)` returns
+ * `{ textcolor?, backgroundcolor?, linecolor? }` (all optional) — the
+ * library itself handles natural-analog fallback for custom symbols.
+ *
+ * Lookups are memoized in a small map keyed by `${kind}:${symbol}`.
+ */
+
+import * as DG from 'datagrok-api/dg';
+
+import {HelmTypes} from '@datagrok-libraries/js-draw-lite/src/types/org';
+import {HelmType} from '@datagrok-libraries/bio/src/helm/types';
+import {_package} from '../package';
+
+/** The four "kinds" we render — maps to the appropriate `HelmType`. */
+export type MonomerKind = 'sugar' | 'base' | 'linker' | 'chem';
+
+const KIND_TO_HELM_TYPE: Record<MonomerKind, HelmType> = {
+  sugar: HelmTypes.SUGAR as HelmType,
+  base: HelmTypes.BASE as HelmType,
+  linker: HelmTypes.LINKER as HelmType,
+  chem: HelmTypes.CHEM as HelmType,
+};
+
+export interface MonomerColorTriple {
+  backgroundcolor: string | null;
+  textcolor: string | null;
+  linecolor: string | null;
+}
+
+const EMPTY: MonomerColorTriple = {backgroundcolor: null, textcolor: null, linecolor: null};
+const _cache = new DG.LruCache<string, MonomerColorTriple>(256);
+
+/** Resolve background/text/line colors for a HELM monomer. Returns `null`s
+ * when the library has no entry. Pure sync — backed by `_package.bioMonomerLib`. */
+export function getMonomerColors(kind: MonomerKind, symbol: string): MonomerColorTriple {
+  if (!symbol) return EMPTY;
+  const key = `${kind}:${symbol}`;
+  const cached = _cache.get(key);
+  if (cached) return cached;
+
+  let result: MonomerColorTriple = EMPTY;
+  try {
+    const lib = _package.bioMonomerLib;
+    const colors = lib.getMonomerColors(KIND_TO_HELM_TYPE[kind], symbol);
+    if (colors) {
+      result = {
+        backgroundcolor: colors.backgroundcolor ?? null,
+        textcolor: colors.textcolor ?? null,
+        linecolor: colors.linecolor ?? null,
+      };
+    }
+  } catch { /* lib not yet initialized — return all-null */ }
+
+  _cache.set(key, result);
+  return result;
+}

package/src/oligo-renderer/tooltip.ts

@@ -14,6 +14,7 @@
 
 import * as grok from 'datagrok-api/grok';
 import * as ui from 'datagrok-api/ui';
+import * as DG from 'datagrok-api/dg';
 
 import {getMonomerLibHelper, IMonomerLib} from '@datagrok-libraries/bio/src/types/monomer-library';
 
@@ -208,14 +209,13 @@ function makeStructureCell(label: string): { root: HTMLElement; body: HTMLDivEle
  * Since only one tooltip is visible at a time, moving the cached node
  * between tooltip hosts via `appendChild` is safe: the previous host is
  * being torn down. */
-const _structCache = new Map<string, HTMLElement>();
+const _structCache = new DG.LruCache<string, HTMLElement>(256);
 
 function drawMolfileCached(host: HTMLDivElement, molfile: string, cacheKey: string): void {
   try {
     let cached = _structCache.get(cacheKey);
     if (!cached) {
       cached = grok.chem.drawMolecule(molfile, STRUCT_W, STRUCT_H, false);
-      if (_structCache.size > 256) _structCache.clear();
       _structCache.set(cacheKey, cached);
     }
     host.innerHTML = '';

package/src/package-api.ts

@@ -162,6 +162,13 @@ export namespace funcs {
     return await grok.functions.call('SequenceTranslator:EditOligoNucleotideCell', { cell });
   }
 
+  /**
+  Edit the oligonucleotide HELM in the HELM Web Editor
+  */
+  export async function openOligoHelmEditor(value: any ): Promise<void> {
+    return await grok.functions.call('SequenceTranslator:OpenOligoHelmEditor', { value });
+  }
+
   /**
   Modifications, lengths, conjugates and color legend for an OligoNucleotide cell
   */
@@ -176,6 +183,20 @@ export namespace funcs {
     return await grok.functions.call('SequenceTranslator:OligoNucleotideStructuresPanel', { value });
   }
 
+  /**
+  Copy the HELM string of an oligo cell to the clipboard
+  */
+  export async function copyOligoAsHelm(value: any ): Promise<void> {
+    return await grok.functions.call('SequenceTranslator:CopyOligoAsHelm', { value });
+  }
+
+  /**
+  Copy a high-resolution image of the oligo duplex
+  */
+  export async function copyOligoAsImage(value: any ): Promise<void> {
+    return await grok.functions.call('SequenceTranslator:CopyOligoAsImage', { value });
+  }
+
   /**
   Create a new column tagged as OligoNucleotide so HELM duplex cells render with the oligo view
   */

package/src/package.g.ts

@@ -236,8 +236,16 @@ export function oligoNucleotideCellRenderer() : any {
 //tags: cellEditor
 //input: grid_cell cell 
 //meta.role: cellEditor
-export async function editOligoNucleotideCell(cell: any) : Promise<void> {
-  await PackageFunctions.editOligoNucleotideCell(cell);
+export function editOligoNucleotideCell(cell: any) : void {
+  PackageFunctions.editOligoNucleotideCell(cell);
+}
+
+//name: Open HELM Editor
+//description: Edit the oligonucleotide HELM in the HELM Web Editor
+//input: semantic_value value { semType: OligoNucleotide }
+//meta.action: Edit HELM
+export function openOligoHelmEditor(value: DG.SemanticValue) : void {
+  PackageFunctions.openOligoHelmEditor(value);
 }
 
 //name: Oligo-Nucleotide
@@ -258,6 +266,22 @@ export function oligoNucleotideStructuresPanel(value: DG.SemanticValue) : any {
   return PackageFunctions.oligoNucleotideStructuresPanel(value);
 }
 
+//name: Copy as HELM
+//description: Copy the HELM string of an oligo cell to the clipboard
+//input: semantic_value value { semType: OligoNucleotide }
+//meta.action: Copy as HELM
+export function copyOligoAsHelm(value: DG.SemanticValue) : void {
+  PackageFunctions.copyOligoAsHelm(value);
+}
+
+//name: Copy as Image
+//description: Copy a high-resolution image of the oligo duplex
+//input: semantic_value value { semType: OligoNucleotide }
+//meta.action: Copy as Image
+export function copyOligoAsImage(value: DG.SemanticValue) : void {
+  PackageFunctions.copyOligoAsImage(value);
+}
+
 //description: Create a new column tagged as OligoNucleotide so HELM duplex cells render with the oligo view
 //input: dataframe table 
 //input: column helmCol { caption: HELM column; semType: Macromolecule }

package/src/package.ts

@@ -20,6 +20,10 @@ import {OligoNucleotideCellRenderer} from './oligo-renderer/cell-renderer';
 import {buildOligoPanel} from './oligo-renderer/legend-panel';
 import {buildOligoStructuresPanel} from './oligo-renderer/structures-panel';
 import {combineSenseAntisenseToOligo, convertHelmColumnToOligo} from './oligo-renderer/converters';
+import {
+  openOligoCanvasDialog, openOligoHelmEditorDialog,
+  copyHelmToClipboard, copyDuplexImageToClipboard,
+} from './oligo-renderer/cell-actions';
 
 import {polyToolConvert, polyToolConvertUI} from './polytool/pt-dialog';
 import {polyToolEnumerateChemApp, polyToolEnumerateChemUI} from './polytool/pt-chem-enum-dialog';
@@ -443,6 +447,10 @@ export class PackageFunctions {
     return new OligoNucleotideCellRenderer();
   }
 
+  /** Double-click cell editor: opens a full-screen modal with a nicely-rendered
+   * canvas view of the duplex. Hover interactions (monomer/linkage tooltip
+   * with cached RDKit structures) mirror what works in the grid cell. Editing
+   * the HELM itself happens through the separate `Open HELM Editor` action. */
   @grok.decorators.func({
     name: 'editOligoNucleotideCell',
     description: 'OligoNucleotide',
@@ -451,24 +459,25 @@ export class PackageFunctions {
       role: 'cellEditor',
     },
   })
-  static async editOligoNucleotideCell(
+  static editOligoNucleotideCell(
     @grok.decorators.param({type: 'grid_cell'}) cell: DG.GridCell,
+  ): void {
+    openOligoCanvasDialog(cell);
+  }
+
+  /** Cell context-menu action: open the HELM Web Editor for the cell's
+   * sequence and write the edited HELM back on OK. Lives in the "Actions"
+   * group on the cell's context menu (same surfacing convention as
+   * `Copy as HELM`). */
+  @grok.decorators.func({
+    name: 'Open HELM Editor',
+    description: 'Edit the oligonucleotide HELM in the HELM Web Editor',
+    meta: {'action': 'Edit HELM'},
+  })
+  static openOligoHelmEditor(
+    @grok.decorators.param({options: {semType: 'OligoNucleotide'}}) value: DG.SemanticValue,
   ): Promise<void> {
-    // Helm:editMoleculeCell can't be reused: it calls seqHelper.getSeqHandler(col),
-    // which throws unless semType === Macromolecule. OligoNucleotide columns have
-    // semType=OligoNucleotide, so we open the HELM Web Editor directly.
-    const helmHelper = await getHelmHelper();
-    const view = ui.div();
-    const app = helmHelper.createWebEditorApp(view, (cell.cell.value as string | null) ?? '');
-    ui.dialog({showHeader: false, showFooter: true})
-      .add(view)
-      .onOK(() => {
-        const helmValue = app.canvas!.getHelm(true)
-          .replace(/<\/span>/g, '')
-          .replace(/<span style='background:#bbf;'>/g, '');
-        cell.setValue(helmValue);
-      })
-      .show({modal: true, fullScreen: true});
+    return openOligoHelmEditorDialog(value);
   }
 
   @grok.decorators.func({
@@ -495,6 +504,38 @@ export class PackageFunctions {
     return buildOligoStructuresPanel(value);
   }
 
+  /** Cell context-menu action: copy the raw HELM string. Surfaced automatically
+   * by the platform under the cell's "Copy" submenu because of `meta.action:
+   * 'Copy as HELM'`; we set `exclude-actions-panel` so it doesn't also show up
+   * in the right-side actions panel. */
+  @grok.decorators.func({
+    name: 'Copy as HELM',
+    description: 'Copy the HELM string of an oligo cell to the clipboard',
+    meta: {'action': 'Copy as HELM'},
+  })
+  static copyOligoAsHelm(
+    @grok.decorators.param({options: {semType: 'OligoNucleotide'}}) value: DG.SemanticValue,
+  ): void {
+    copyHelmToClipboard(value);
+  }
+
+  /** Cell context-menu action: render the duplex to a high-resolution PNG with
+   * transparent background and copy it to the system clipboard. Canvas pixel
+   * dimensions are scaled up but the logical layout sees the original
+   * gridCell bounds — so chip sizes match what's on-screen, just at higher
+   * pixel density. drawDuplex itself never paints a backdrop, which keeps
+   * the alpha channel clean. */
+  @grok.decorators.func({
+    name: 'Copy as Image',
+    description: 'Copy a high-resolution image of the oligo duplex',
+    meta: {'action': 'Copy as Image'},
+  })
+  static copyOligoAsImage(
+    @grok.decorators.param({options: {semType: 'OligoNucleotide'}}) value: DG.SemanticValue,
+  ): void {
+    copyDuplexImageToClipboard(value);
+  }
+
   // Invoked from the column / cell context menu via detectors.js (no top-menu).
   @grok.decorators.func({
     name: 'convertHelmToOligoNucleotide',

package/src/polytool/pt-chem-enum-dialog.ts

@@ -1269,14 +1269,18 @@ async function executeEnumeration(state: ChemEnumDialogState, _rdkit: RDModule):
     // Stage 2 — canonicalize the whole Enumerated column in parallel via Chem workers.
     pi.update(40, `Canonicalizing ${results.length.toLocaleString()} molecule(s)...`);
     try {
-      await grok.functions.call('Chem:convertNotation', {
+      const res: DG.Column = await grok.functions.call('Chem:convertNotation', {
         data: df,
         molecules: smilesCol,
         targetNotation: DG.chem.Notation.Smiles,
-        overwrite: true,
+        overwrite: false,
         join: false,
         kekulize: false,
       });
+      // in older version of the chem, overwrite is super slow, it has been updated but we can do it like this here
+      const resArr = res.toList();
+      smilesCol.init((i) => resArr[i]);
+      smilesCol.meta.units = DG.chem.Notation.Smiles;
     } catch (err: any) {
       // Canonicalization is a nice-to-have; the uncanonical SMILES are still valid output.
       _package.logger.warning(`Canonicalization skipped: ${err?.message ?? err}`);