From 19aa61f593c896f4d3bd0ffae6dbe306c2a9546d Mon Sep 17 00:00:00 2001
From: mehekj <mehek.jethani@gmail.com>
Date: Wed, 10 Aug 2022 11:51:41 -0400
Subject: basic table in progress

---
 .../collectionSchema/SchemaColumnHeader.tsx        | 28 ++++++++++++++++++++++
 1 file changed, 28 insertions(+)
 create mode 100644 src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx

(limited to 'src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx')

diff --git a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
new file mode 100644
index 000000000..9bd1b843f
--- /dev/null
+++ b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
@@ -0,0 +1,28 @@
+import React = require('react');
+import { observer } from 'mobx-react';
+import './CollectionSchemaView.scss';
+import { EditableView } from '../../EditableView';
+import { emptyFunction } from '../../../../Utils';
+import { action, computed } from 'mobx';
+
+export interface SchemaColumnHeaderProps {
+    columnKeys: string[];
+    columnWidths: number[];
+    columnIndex: number;
+    changeColumnKey: (index: number, newKey: string) => boolean;
+}
+
+@observer
+export class SchemaColumnHeader extends React.Component<SchemaColumnHeaderProps> {
+    @computed get fieldKey() {
+        return this.props.columnKeys[this.props.columnIndex];
+    }
+
+    render() {
+        return (
+            <div className="schema-column-header" style={{ width: this.props.columnWidths[this.props.columnIndex] }}>
+                <EditableView SetValue={(newKey: string) => this.props.changeColumnKey(this.props.columnIndex, newKey)} GetValue={() => this.fieldKey} contents={this.fieldKey} />
+            </div>
+        );
+    }
+}
-- 
cgit v1.2.3-70-g09d2