buckaroo-js-core 0.8.4 → 0.11.7

package/src/buckaroo_js/components/Operations.tsx

@@ -1,243 +0,0 @@
-import React, {useState} from 'react';
-import _ from 'lodash';
-import {Operation, SetOperationsFunc, OperationEventFunc, NoArgEventFunc} from './OperationUtils';
-import {CommandConfigT} from './CommandUtils';
-import {replaceInArr} from './utils';
-
-import {OperationDetail} from './OperationDetail';
-import {AgGridReact} from 'ag-grid-react'; // the AG Grid React Component
-import {ColDef, GridOptions} from 'ag-grid-community';
-//import { CustomCellRendererProps } from '@ag-grid-community/react';
-
-import {updateAtMatch} from './utils';
-import 'ag-grid-community/styles/ag-grid.css';
-import 'ag-grid-community/styles/ag-theme-alpine.css';
-
-export const OperationsList = ({
-    operations,
-    activeKey,
-    setActiveKey,
-    delKey
-}: {
-    operations: Operation[];
-    activeKey?: string;
-    setActiveKey: React.Dispatch<React.SetStateAction<string>>;
-    delKey: any;
-}) => {
-    const renderOperation = (params: any) => (
-        <span className='missionSpan'>
-            <span
-                style={{
-                    height: 30,
-                    width: 30,
-                    margin: 3,
-                    paddingBottom: 8,
-                    float: 'left',
-                    background: 'grey'
-                }}
-                onClick={delKey(params.value[0])}
-            >
-                X
-            </span>
-            <span>{params.value[1]}</span>
-        </span>
-    );
-
-    const getColumns = (passedOperations: Operation[]): ColDef[] =>
-        _.map(Array.from(passedOperations.entries()), ([index, element]) => {
-            const name = element[0]['symbol'];
-            const key = name + index.toString();
-            const column = {
-                field: key,
-                headerName: name,
-                cellRenderer: renderOperation
-            }; // width: 20, maxWidth: 60};
-            return column;
-        });
-
-    const rowElements: Record<string, [string, string]>[] = _.map(
-        Array.from(operations.entries()),
-        ([index, element]) => {
-            const name = element[0]['symbol'];
-            const key = name + index.toString();
-            const rowEl: Record<string, [string, string]> = {};
-            rowEl[key] = [key, element[2]]; //key, colName
-            return rowEl;
-        }
-    );
-    const rows = [_.merge({}, ...rowElements)];
-    const columns = getColumns(operations);
-
-    const styledColumns = updateAtMatch(
-        _.clone(columns),
-        activeKey || '___never',
-        {
-            cellStyle: {background: 'var(--ag-range-selection-background-color-3)'}
-        },
-        {cellStyle: {}}
-    );
-
-    const gridOptions: GridOptions = {
-        rowSelection: 'single',
-        headerHeight: 30,
-        onCellClicked: (event) => {
-            const colName = event.column.getColId();
-            setActiveKey(colName);
-        }
-    };
-    return (
-        <div style={{height: 78, width: 1000}} className='ag-theme-alpine'>
-            <AgGridReact
-                gridOptions={gridOptions}
-                rowData={rows}
-                columnDefs={styledColumns}
-            ></AgGridReact>
-        </div>
-    );
-};
-
-export const OperationAdder = ({
-    column,
-    addOperationCb,
-    defaultArgs
-}: {
-    column: string;
-    addOperationCb: any;
-    defaultArgs: any;
-}): JSX.Element => {
-    const addOperationByName = (localOperationName: string) => {
-        return () => {
-            const defaultOperation = defaultArgs[localOperationName];
-            addOperationCb(replaceInArr(defaultOperation, 'col', column));
-        };
-    };
-
-    return (
-        <div className='operation-adder'>
-            <span className={'column-name'}> Column: {column}</span>
-            <fieldset>
-                {_.keys(defaultArgs).map((optionVal) => (
-                    <button key={optionVal} onClick={addOperationByName(optionVal)}>
-                        {' '}
-                        {optionVal}{' '}
-                    </button>
-                ))}
-            </fieldset>
-        </div>
-    );
-};
-
-export const OperationViewer = ({
-    operations,
-    setOperations,
-    activeColumn,
-    allColumns,
-    commandConfig
-}: {
-    operations: Operation[];
-    setOperations: SetOperationsFunc;
-    activeColumn: string;
-    allColumns: string[];
-    commandConfig: CommandConfigT;
-}) => {
-    const opToKey = (idx: number, op: Operation): string => {
-        const name = op[0]['symbol'];
-        return name + idx.toString();
-    };
-
-    const operationObjs = _.map(Array.from(operations.entries()), ([index, element]) => {
-        const rowEl: Record<string, Operation> = {};
-        rowEl[opToKey(index, element)] = element;
-        return rowEl;
-    });
-    //why am I doing this? probably something so I gauruntee a clean dict
-
-    const operationDict = _.merge({}, ...operationObjs);
-
-    const idxObjs = _.map(Array.from(operations.entries()), ([index, element]) => {
-        const rowEl: Record<string, number> = {};
-        rowEl[opToKey(index, element)] = index;
-        return rowEl;
-    });
-    const keyToIdx = _.merge({}, ...idxObjs);
-
-    // previously was null
-    const [activeKey, setActiveKey] = useState('');
-
-    function getSetOperation(key: string): OperationEventFunc {
-        return (newOperation: Operation) => {
-            const index = keyToIdx[key];
-            const nextOperations = operations.map((c, i) => {
-                if (i === index) {
-                    return newOperation;
-                } else {
-                    return c;
-                }
-            });
-            console.log('about to call setOperations', key, newOperation);
-            setOperations(nextOperations);
-        };
-    }
-
-    function getDeleteOperation(key: string): NoArgEventFunc {
-        return (): void => {
-            const index = keyToIdx[key];
-            const nextOperations = operations.map((c, i) => {
-                if (i === index) {
-                    return undefined;
-                } else {
-                    return c;
-                }
-            });
-            //const newIdx = Math.max(0, index - 1);
-            const newOps = _.filter(nextOperations) as Operation[];
-            console.log('getDeleteOperations', operations.length, newOps.length);
-            setOperations(newOps);
-            //setActiveKey(opToKey(newIdx, newOps[newIdx]));
-            //setActiveKey('');
-        };
-    }
-
-    const getColumns = (passedOperations: Operation[]): ColDef[] =>
-        _.map(Array.from(passedOperations.entries()), ([index, element]) => {
-            const name = element[0]['symbol'];
-            const key = name + index.toString();
-            const column = {field: key, headerName: name}; // width: 20, maxWidth: 60};
-            return column;
-        });
-    const addOperation: OperationEventFunc = (newOperation: Operation) => {
-        const newOperationArr = [...operations, newOperation];
-        setOperations(newOperationArr);
-        const newOperationKey = getColumns(newOperationArr)[newOperationArr.length - 1].field;
-        if (newOperationKey !== undefined) {
-            setActiveKey(newOperationKey);
-        }
-    };
-    const {argspecs, defaultArgs} = commandConfig;
-    return (
-        <div className='command-viewer'>
-            <OperationAdder
-                column={activeColumn}
-                addOperationCb={addOperation}
-                defaultArgs={defaultArgs}
-            />
-            <div className='operations-box'>
-                <h4> Operations </h4>
-                <OperationsList
-                    operations={operations}
-                    activeKey={activeKey}
-                    setActiveKey={setActiveKey}
-                    delKey={getDeleteOperation}
-                />
-            </div>
-            {activeKey && (
-                <OperationDetail
-                    command={operationDict[activeKey]}
-                    setCommand={getSetOperation(activeKey)}
-                    columns={allColumns}
-                    commandPatterns={argspecs}
-                />
-            )}
-        </div>
-    );
-};

package/src/buckaroo_js/components/StatusBar.tsx

@@ -1,190 +0,0 @@
-// https://plnkr.co/edit/QTNwBb2VEn81lf4t?open=index.tsx
-import React, {useRef, useCallback} from 'react';
-import _ from 'lodash';
-import {AgGridReact} from 'ag-grid-react'; // the AG Grid React Component
-import {ColDef, GridOptions} from 'ag-grid-community';
-import {basicIntFormatter} from './DFViewerParts/Displayer';
-import {DFMeta} from './WidgetTypes';
-import {BuckarooOptions} from './WidgetTypes';
-import {BuckarooState, BKeys} from './WidgetTypes';
-export type setColumFunc = (newCol: string) => void;
-
-const helpCell = function (params: any) {
-    return (
-        <a
-            href='https://buckaroo-data.readthedocs.io/en/latest/feature_reference.html'
-            target='_blank'
-            rel='noopener noreferrer'
-        >
-            ?
-        </a>
-    );
-};
-
-export function StatusBar({
-    dfMeta,
-    buckarooState,
-    setBuckarooState,
-    buckarooOptions
-}: {
-    dfMeta: DFMeta;
-    buckarooState: BuckarooState;
-    setBuckarooState: React.Dispatch<React.SetStateAction<BuckarooState>>;
-    buckarooOptions: BuckarooOptions;
-}) {
-    /*
-      AgGridReact
-        rowData={rowData}
-        columnDefs={columns}
-        singleClickEdit={true}
-        stopEditingWhenCellsLoseFocus={true}
-*/
-
-    //console.log('initial buckarooState', buckarooState);
-    //   const optionCycles = _.fromPairs(
-    // //    _.map(buckarooOptions, (v: any, k) => [k, ( k==='df_display' ? v :  _.concat([false], v) ) ])
-    //     _.map(buckarooOptions, (v: any, k) => [k, ( k==='post_processing' ? v :  _.concat([false], v) ) ])
-
-    //   ) as Record<BKeys, any[]>;
-    const optionCycles = buckarooOptions;
-    const idxs = _.fromPairs(
-        _.map(_.keys(optionCycles), (k) => [
-            k,
-            _.indexOf(optionCycles[k as BKeys], buckarooState[k as BKeys])
-        ])
-    );
-
-    const nextIndex = (curIdx: number, arr: any[]) => {
-        if (curIdx === arr.length - 1) {
-            return 0;
-        }
-        return curIdx + 1;
-    };
-
-    const newBuckarooState = (k: BKeys) => {
-        const arr = optionCycles[k];
-        const curIdx = idxs[k];
-        const nextIdx = nextIndex(curIdx, arr);
-        const newVal = arr[nextIdx];
-        const newState = _.clone(buckarooState);
-        newState[k] = newVal;
-        return newState;
-    };
-    const updateDict = (event: any) => {
-        const colName = event.column.getColId();
-        if (colName === 'quick_command_args' || colName === 'search') {
-            return;
-        }
-        if (_.includes(_.keys(buckarooState), colName)) {
-            const nbstate = newBuckarooState(colName as BKeys);
-            setBuckarooState(nbstate);
-        }
-    };
-
-    const handleCellChange = useCallback((params: {oldValue: any; newValue: any}) => {
-        const {oldValue, newValue} = params;
-
-        if (oldValue !== newValue && newValue !== null) {
-            //console.log('Edited cell:', newValue);
-            const newState = {
-                ...buckarooState,
-                quick_command_args: {search: [newValue]}
-            };
-            //console.log('handleCellChange', buckarooState, newState);
-            setBuckarooState(newState);
-        }
-    }, []);
-
-    const columnDefs: ColDef[] = [
-        {
-            field: 'search',
-            headerName: 'search',
-            width: 200,
-            editable: true,
-            onCellValueChanged: handleCellChange
-            //hide: !showSearch,
-        },
-        {
-            field: 'df_display',
-            headerName: 'Σ', //note the greek symbols instead of icons which require buildchain work
-            headerTooltip: 'Summary Stats',
-            width: 120
-        },
-        /*
-    {
-      field: 'auto_clean',
-      //headerName: 'Σ', //note the greek symbols instead of icons which require buildchain work
-      headerName: 'auto cleaning',
-      headerTooltip: 'Auto Cleaning config',
-      width: 120,
-    },
-    */
-        {
-            field: 'post_processing',
-            //      headerName: "Θ",
-            headerName: 'post processing',
-            headerTooltip: 'post process method',
-            width: 100
-        },
-        {
-            field: 'show_commands',
-            headerName: 'λ',
-            headerTooltip: 'Show Commands',
-            width: 30
-        },
-
-        {field: 'sampled', headerName: 'Ξ', headerTooltip: 'Sampled', width: 30},
-        {
-            field: 'help',
-            headerName: '?',
-            headerTooltip: 'Help',
-            width: 30,
-            cellRenderer: helpCell
-        },
-        {field: 'total_rows', width: 100},
-        {field: 'filtered_rows', headerName: 'filtered', width: 85},
-        {field: 'rows_shown', headerName: 'displayed', width: 85},
-        {field: 'columns', width: 75}
-    ];
-
-    const searchArg = buckarooState.quick_command_args?.search;
-    const searchStr = searchArg && searchArg.length === 1 ? searchArg[0] : '';
-
-    const rowData = [
-        {
-            total_rows: basicIntFormatter.format(dfMeta.total_rows),
-            columns: dfMeta.columns,
-            rows_shown: basicIntFormatter.format(dfMeta.rows_shown),
-            sampled: buckarooState.sampled || '0',
-            auto_clean: buckarooState.auto_clean || '0',
-            df_display: buckarooState.df_display,
-            filtered_rows: basicIntFormatter.format(dfMeta.filtered_rows),
-            post_processing: buckarooState.post_processing,
-            show_commands: buckarooState.show_commands || '0',
-            search: searchStr
-        }
-    ];
-
-    const gridOptions: GridOptions = {
-        suppressRowClickSelection: true
-    };
-
-    const gridRef = useRef<AgGridReact<unknown>>(null);
-    const defaultColDef = {
-        cellStyle: {textAlign: 'left'}
-    };
-    return (
-        <div className='statusBar'>
-            <div style={{height: 50}} className='theme-hanger ag-theme-alpine-dark'>
-                <AgGridReact
-                    ref={gridRef}
-                    onCellClicked={updateDict}
-                    gridOptions={gridOptions}
-                    defaultColDef={defaultColDef}
-                    rowData={rowData}
-                    columnDefs={columnDefs}
-                ></AgGridReact>
-            </div>
-        </div>
-    );
-}

package/src/buckaroo_js/components/WidgetTypes.tsx

@@ -1,42 +0,0 @@
-export interface DFMeta {
-    // static,
-    total_rows: number;
-    columns: number;
-    filtered_rows: number;
-    rows_shown: number;
-}
-export interface BuckarooOptions {
-    sampled: string[];
-    auto_clean: string[];
-    post_processing: string[];
-    df_display: string[]; // keys into Into df_display_args
-    show_commands: string[];
-}
-
-export type QuickAtom = number | string;
-export type QuickArg = QuickAtom[];
-export interface BuckarooState {
-    sampled: string | false;
-    auto_clean: string | false;
-    quick_command_args: Record<string, QuickArg>;
-    post_processing: string | false;
-    df_display: string; //at least one dataframe must always be displayed
-    show_commands: string | false;
-}
-
-export type BKeys = keyof BuckarooOptions;
-
-// df_dict: Record<string, DFWhole>;
-// df_meta: DFMeta;
-/*
-
-  df_dict: Record<string, DFWhole>;
-  df_meta: DFMeta;
-  operations: Operation[];
-  on_operations: (ops: Operation[]) => void;
-  operation_results: OperationResult;
-  commandConfig: CommandConfigT;
-  buckaroo_state: BuckarooState;
-  on_buckaroo_state: React.Dispatch<React.SetStateAction<BuckarooState>>;
-  buckaroo_options: BuckarooOptions;
-*/

package/src/buckaroo_js/components/bakedOperationDefaults.ts

@@ -1,14 +0,0 @@
-import {OperationDefaultArgs} from './OperationUtils';
-import {sym} from './utils';
-import {symDf, CommandConfigT, bakedArgSpecs} from './CommandUtils';
-
-export const bakedOperationDefaults: OperationDefaultArgs = {
-    dropcol: [sym('dropcol'), symDf, 'col'],
-    fillna: [sym('fillna'), symDf, 'col', 8],
-    resample: [sym('resample'), symDf, 'col', 'monthly', {}]
-};
-
-export const bakedCommandConfig: CommandConfigT = {
-    argspecs: bakedArgSpecs,
-    defaultArgs: bakedOperationDefaults
-};

package/src/buckaroo_js/components/utils.ts

@@ -1,60 +0,0 @@
-import _ from 'lodash';
-import {DFWhole} from './DFViewerParts/DFWhole';
-import {ColDef} from 'ag-grid-community';
-
-export type setDFFunc = (newDf: DFWhole) => void;
-
-export const requestDf = (url: string, setCallBack: setDFFunc) => {
-    const retPromise = fetch(url).then(async (response) => {
-        const tableDf = await response.json();
-        setCallBack(tableDf);
-    });
-    return retPromise;
-};
-
-export const sym = (symbolName: string) => {
-    return {symbol: symbolName};
-};
-
-export function replaceInArr<T>(arr: T[], old: T, subst: T): T[] {
-    return arr.map((item: T) => (item === old ? subst : item));
-}
-
-export function replaceAtIdx<T>(arr: T[], idx: number, subst: T): T[] {
-    return arr.map((item: T, innerIdx: number) => (innerIdx === idx ? subst : item));
-}
-
-export function replaceAtKey<T>(obj: Record<string, T>, key: string, subst: T): Record<string, T> {
-    const objCopy = _.clone(obj);
-    objCopy[key] = subst;
-    return objCopy;
-}
-
-export const objWithoutNull = (obj: Record<string, string>, extraStrips: string[] = []) =>
-    _.pickBy(obj, (x) => ![null, undefined, ...extraStrips].includes(x));
-export const updateAtMatch = (
-    cols: ColDef[],
-    key: string,
-    subst: Partial<ColDef>,
-    negative: Partial<ColDef>
-) => {
-    const retColumns = cols.map((x) => {
-        if (x.field === key) {
-            return {...x, ...subst};
-        } else {
-            return {...x, ...negative};
-        }
-    });
-    return retColumns;
-};
-
-export const replaceAtMatch = (cols: ColDef[], key: string, subst: Partial<ColDef>) => {
-    const retColumns = cols.map((x) => {
-        if (x.field === key) {
-            return {...x, ...subst};
-        } else {
-            return {...x};
-        }
-    });
-    return retColumns;
-};

package/src/buckaroo_js/extension.ts

@@ -1,15 +0,0 @@
-// Copyright (c) Jupyter Development Team.
-// Distributed under the terms of the Modified BSD License.
-
-// Entry point for the notebook bundle containing custom model definitions.
-//
-// Setup notebook base URL
-//
-// Some static assets may be required by the custom widget javascript. The base
-// url for the notebook is not known at build time and is therefore computed
-// dynamically.
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-(window as any).__webpack_public_path__ =
-    document.querySelector('body')!.getAttribute('data-base-url') + 'nbextensions/buckaroo';
-
-export * from './index';

package/src/buckaroo_js/index.ts

@@ -1,34 +0,0 @@
-// Copyright (c) Bloomberg
-// Distributed under the terms of the Modified BSD License.
-
-import {ColumnsEditor, ColumnsEditorEx} from './components/ColumnsEditor';
-import {WidgetDCFCellExample} from './components/DCFCell';
-import {DFViewer, DFViewerEx} from './components/DFViewerParts/DFViewer';
-import {HistogramCell} from './components/DFViewerParts/HistogramCell';
-import {DependentTabs} from './components/DependentTabs';
-import {OperationViewer} from './components/Operations';
-//import { DFData, DFViewerConfig } from './components/DFViewerParts/DFWhole';
-import {StatusBar} from './components/StatusBar';
-
-// In case of classic Jupyter Notebook and embed, we provide the PhosphorJS CSS
-
-export * as bakedData from './baked_data/staticData';
-
-export const extraComponents = {
-    ColumnsEditor,
-    DependentTabs,
-    OperationViewer,
-    WidgetDCFCellExample,
-    ColumnsEditorEx,
-    DFViewer,
-    DFViewerEx,
-    StatusBar,
-    HistogramCell
-};
-
-/*
-export const typing = { 
-    DFData, 
-    DFViewerConfig
- };
-*/