Add Copying and Exporting Support to Edit Data

extensions/mssql/l10n/bundle.l10n.json

@@ -907,6 +907,7 @@
     "Expand all groups": "Expand all groups",
     "Export to CSV": "Export to CSV",
     "Export to Excel": "Export to Excel",
+    "Export to JSON": "Export to JSON",
     "Export to text format": "Export to text format",
     "Export to tab delimited": "Export to tab delimited",
     "Filter shortcuts": "Filter shortcuts",
@@ -2155,6 +2156,14 @@
         "comment": ["{0} is the table name"]
     },
     "Discard": "Discard",
+    "Results exported successfully to {0}/{0} is the file path": {
+        "message": "Results exported successfully to {0}",
+        "comment": ["{0} is the file path"]
+    },
+    "Failed to export results: {0}/{0} is the error message": {
+        "message": "Failed to export results: {0}",
+        "comment": ["{0} is the error message"]
+    },
     "MSSQL: Welcome & What's New": "MSSQL: Welcome & What's New",
     "Try it": "Try it",
     "Watch demo": "Watch demo",

extensions/mssql/src/constants/locConstants.ts

@@ -2371,6 +2371,20 @@ export class TableExplorer {
     public static Save = l10n.t("Save");
     public static Discard = l10n.t("Discard");
     public static Cancel = l10n.t("Cancel");
+
+    public static exportSuccessful = (filePath: string) =>
+        l10n.t({
+            message: "Results exported successfully to {0}",
+            args: [filePath],
+            comment: ["{0} is the file path"],
+        });
+
+    public static exportFailed = (errorMessage: string) =>
+        l10n.t({
+            message: "Failed to export results: {0}",
+            args: [errorMessage],
+            comment: ["{0} is the error message"],
+        });
 }
 
 export class Changelog {

extensions/mssql/src/models/contracts.ts

@@ -127,3 +127,110 @@ export namespace SaveResultsAsInsertRequest {
     >("query/saveInsert");
 }
 // --------------------------------- </ Save Results as INSERT Request > ------------------------------------------
+
+// --------------------------------- < Serialize Data Request > ------------------------------------------
+// Serialize data to CSV, JSON, or Excel format using the backend serialization service
+
+export class SerializeColumnInfo {
+    /**
+     * Name of this column
+     */
+    public name: string;
+
+    /**
+     * Data type name of this column
+     */
+    public dataTypeName: string;
+}
+
+export class SerializeDbCellValue {
+    /**
+     * Display value of the cell
+     */
+    public displayValue: string;
+
+    /**
+     * Whether the cell value is null
+     */
+    public isNull: boolean;
+}
+
+export class SerializeDataStartRequestParams {
+    /**
+     * The format to serialize the data to (csv, json, excel)
+     */
+    public saveFormat: string;
+
+    /**
+     * Path to file that the serialized results will be stored in
+     */
+    public filePath: string;
+
+    /**
+     * Results that are to be serialized
+     */
+    public rows: SerializeDbCellValue[][];
+
+    /**
+     * Column information for the data
+     */
+    public columns: SerializeColumnInfo[];
+
+    /**
+     * Whether this is the only batch (or last batch) for this file
+     */
+    public isLastBatch: boolean;
+
+    /**
+     * Whether to include column headers in the output
+     */
+    public includeHeaders?: boolean;
+
+    /**
+     * Delimiter for CSV format
+     */
+    public delimiter?: string;
+
+    /**
+     * Line separator for CSV format
+     */
+    public lineSeparator?: string;
+
+    /**
+     * Text identifier for CSV format
+     */
+    public textIdentifier?: string;
+
+    /**
+     * Encoding for the output file
+     */
+    public encoding?: string;
+
+    /**
+     * Whether to format JSON output
+     */
+    public formatted?: boolean;
+}
+
+export class SerializeDataResult {
+    /**
+     * Error or status messages
+     */
+    public messages: string;
+
+    /**
+     * Whether the serialization succeeded
+     */
+    public succeeded: boolean;
+}
+
+// Serialize data request to backend service
+export namespace SerializeStartRequest {
+    export const type = new RequestType<
+        SerializeDataStartRequestParams,
+        SerializeDataResult,
+        void,
+        void
+    >("serialize/start");
+}
+// --------------------------------- </ Serialize Data Request > ------------------------------------------

extensions/mssql/src/reactviews/common/locConstants.ts

@@ -1348,9 +1348,12 @@ export class LocConstants {
             columnResizeByContent: l10n.t("Column resize by content"),
             commands: l10n.t("Commands"),
             copy: l10n.t("Copy"),
+            copyWithHeaders: l10n.t("Copy with Headers"),
+            copyHeaders: l10n.t("Copy Headers"),
             expandAllGroups: l10n.t("Expand all groups"),
             exportToCsv: l10n.t("Export to CSV"),
             exportToExcel: l10n.t("Export to Excel"),
+            exportToJson: l10n.t("Export to JSON"),
             exportToTextFormat: l10n.t("Export to text format"),
             exportToTabDelimited: l10n.t("Export to tab delimited"),
             filterShortcuts: l10n.t("Filter shortcuts"),

extensions/mssql/src/reactviews/pages/TableExplorer/TableDataGrid.css

@@ -540,3 +540,13 @@
 #tableExplorerGrid .slick-row.deleted-row .slick-cell .action-icon.pointer {
     color: var(--vscode-foreground);
 }
+
+/* Cell range selection styles (for Excel copy buffer / Ctrl+drag selection) */
+#tableExplorerGrid .slick-cell.selected {
+    background-color: var(--vscode-editor-selectionBackground, rgba(0, 120, 215, 0.3)) !important;
+}
+
+#tableExplorerGrid .slick-cell.copied {
+    background-color: var(--vscode-editor-selectionBackground, rgba(0, 0, 255, 0.2)) !important;
+    transition: 0.5s background;
+}