#2828

Committed 18 Mar 2024 12:10PM UTC coverage: 15.895% (-67.8%) from 83.718%

Build # #2828

Build Type

push

Committed by

Commit Message

1.21.6

Coverage Stats

57 of 368 branches covered (15.49%)

Branch coverage included in aggregate %.

101 of 626 relevant lines covered (16.13%)

0.85 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/src/js/components/VariableMeta.js

import React from 'react';
import dispatcher from './../helpers/dispatcher';

import CopyToClipboard from './CopyToClipboard';
import CustomButton from './CustomButton';
import { toType } from './../helpers/util';

//icons
import { RemoveCircle as Remove, AddCircle as Add } from './icons';

//theme
import Theme from './../themes/getStyle';

export default class extends React.PureComponent {
    getObjectSize = () => {
        const { size, theme, displayObjectSize } = this.props;
        if (displayObjectSize) {
            return (
                <span class="object-size" {...Theme(theme, 'object-size')}>
                    {size} item{size === 1 ? '' : 's'}
                </span>
            );
        }
    };

    getAddAttribute = rowHovered => {
        const { theme, namespace, name, src, rjvId, depth } = this.props;

        return (
            <span
                class="click-to-add"
                style={{
                    verticalAlign: 'top',
                    display: rowHovered ? 'inline-block' : 'none'
                }}
            >
                <Add
                    class="click-to-add-icon"
                    {...Theme(theme, 'addVarIcon')}
                    onClick={() => {
                        const request = {
                            name: depth > 0 ? name : null,
                            namespace: namespace.splice(
                                0,
                                namespace.length - 1
                            ),
                            existing_value: src,
                            variable_removed: false,
                            key_name: null
                        };
                        if (toType(src) === 'object') {
                            dispatcher.dispatch({
                                name: 'ADD_VARIABLE_KEY_REQUEST',
                                rjvId: rjvId,
                                data: request
                            });
                        } else {
                            dispatcher.dispatch({
                                name: 'VARIABLE_ADDED',
                                rjvId: rjvId,
                                data: {
                                    ...request,
                                    new_value: [...src, null]
                                }
                            });
                        }
                    }}
                />
            </span>
        );
    };

    getRemoveObject = rowHovered => {
        const { theme, hover, namespace, name, src, rjvId } = this.props;

        //don't allow deleting of root node
        if (namespace.length === 1) {
            return;
        }
        return (
            <span
                class="click-to-remove"
                style={{
                    display: rowHovered ? 'inline-block' : 'none'
                }}
            >
                <Remove
                    class="click-to-remove-icon"
                    {...Theme(theme, 'removeVarIcon')}
                    onClick={() => {
                        dispatcher.dispatch({
                            name: 'VARIABLE_REMOVED',
                            rjvId: rjvId,
                            data: {
                                name: name,
                                namespace: namespace.splice(
                                    0,
                                    namespace.length - 1
                                ),
                                existing_value: src,
                                variable_removed: true
                            }
                        });
                    }}
                />
            </span>
        );
    };

    render = () => {
        const {
            theme,
            onDelete,
            onAdd,
            enableClipboard,
            src,
            namespace,
            rowHovered,
            name,
            customButtons
        } = this.props;
        const {actions = []} = src.rowConfig || {};
        return (
            <div
                {...Theme(theme, 'object-meta-data')}
                class="object-meta-data"
                onClick={e => {
                    e.stopPropagation();
                }}
            >
                {/* size badge display */}
                {this.getObjectSize()}
                {/* copy to clipboard icon */}
                {enableClipboard ? (
                    <CopyToClipboard
                        rowHovered={rowHovered}
                        clickCallback={enableClipboard}
                        {...{ src, theme, namespace }}
                    />
                ) : null}
                {customButtons[name] ? (
                    <CustomButton
                    rowHovered={rowHovered}
                    {...customButtons[name]}
                    {...{ src, theme, namespace }}
                />
                ) : null}
                {actions.filter(v => v.type === 'button').map(v => {
                    return (<CustomButton
                        rowHovered={rowHovered}
                        {...v}
                        {...{ src, theme, namespace }}
                    />)
                })}
                {/* copy add/remove icons */}
                {onAdd !== false ? this.getAddAttribute(rowHovered) : null}
                {onDelete !== false ? this.getRemoveObject(rowHovered) : null}
            </div>
        );
    };
}

1	import React from 'react';
2	import dispatcher from './../helpers/dispatcher';
3
4	import CopyToClipboard from './CopyToClipboard';
5	import CustomButton from './CustomButton';
6	import { toType } from './../helpers/util';
7
8	//icons
9	import { RemoveCircle as Remove, AddCircle as Add } from './icons';
10
11	//theme
12	import Theme from './../themes/getStyle';
13
14	export default class extends React.PureComponent {
15	getObjectSize = () => {	×
16	const { size, theme, displayObjectSize } = this.props;	×
17	if (displayObjectSize) {	×
18	return (	×
19	<span class="object-size" {...Theme(theme, 'object-size')}>
20	{size} item{size === 1 ? '' : 's'}	×
21	</span>
22	);
23	}
24	};
25
26	getAddAttribute = rowHovered => {	×
27	const { theme, namespace, name, src, rjvId, depth } = this.props;	×
28
29	return (	×
30	<span
31	class="click-to-add"
32	style={{
33	verticalAlign: 'top',
34	display: rowHovered ? 'inline-block' : 'none'	×
35	}}
36	>
37	<Add
38	class="click-to-add-icon"
39	{...Theme(theme, 'addVarIcon')}
40	onClick={() => {
41	const request = {	×
42	name: depth > 0 ? name : null,	×
43	namespace: namespace.splice(
44	0,
45	namespace.length - 1
46	),
47	existing_value: src,
48	variable_removed: false,
49	key_name: null
50	};
51	if (toType(src) === 'object') {	×
52	dispatcher.dispatch({	×
53	name: 'ADD_VARIABLE_KEY_REQUEST',
54	rjvId: rjvId,
55	data: request
56	});
57	} else {
58	dispatcher.dispatch({	×
59	name: 'VARIABLE_ADDED',
60	rjvId: rjvId,
61	data: {
62	...request,
63	new_value: [...src, null]
64	}
65	});
66	}
67	}}
68	/>
69	</span>
70	);
71	};
72
73	getRemoveObject = rowHovered => {	×
74	const { theme, hover, namespace, name, src, rjvId } = this.props;	×
75
76	//don't allow deleting of root node
77	if (namespace.length === 1) {	×
78	return;	×
79	}
80	return (	×
81	<span
82	class="click-to-remove"
83	style={{
84	display: rowHovered ? 'inline-block' : 'none'	×
85	}}
86	>
87	<Remove
88	class="click-to-remove-icon"
89	{...Theme(theme, 'removeVarIcon')}
90	onClick={() => {
91	dispatcher.dispatch({	×
92	name: 'VARIABLE_REMOVED',
93	rjvId: rjvId,
94	data: {
95	name: name,
96	namespace: namespace.splice(
97	0,
98	namespace.length - 1
99	),
100	existing_value: src,
101	variable_removed: true
102	}
103	});
104	}}
105	/>
106	</span>
107	);
108	};
109
110	render = () => {	×
111	const {
112	theme,
113	onDelete,
114	onAdd,
115	enableClipboard,
116	src,
117	namespace,
118	rowHovered,
119	name,
120	customButtons
121	} = this.props;	×
122	const {actions = []} = src.rowConfig \|\| {};	×
123	return (	×
124	<div
125	{...Theme(theme, 'object-meta-data')}
126	class="object-meta-data"
127	onClick={e => {
128	e.stopPropagation();	×
129	}}
130	>
131	{/* size badge display */}
132	{this.getObjectSize()}
133	{/* copy to clipboard icon */}
134	{enableClipboard ? (	×
135	<CopyToClipboard
136	rowHovered={rowHovered}
137	clickCallback={enableClipboard}
138	{...{ src, theme, namespace }}
139	/>
140	) : null}
141	{customButtons[name] ? (	×
142	<CustomButton
143	rowHovered={rowHovered}
144	{...customButtons[name]}
145	{...{ src, theme, namespace }}
146	/>
147	) : null}
148	{actions.filter(v => v.type === 'button').map(v => {	×
149	return (<CustomButton	×
150	rowHovered={rowHovered}
151	{...v}
152	{...{ src, theme, namespace }}
153	/>)
154	})}
155	{/* copy add/remove icons */}
156	{onAdd !== false ? this.getAddAttribute(rowHovered) : null}	×
157	{onDelete !== false ? this.getRemoveObject(rowHovered) : null}	×
158	</div>
159	);
160	};
161	}

mac-s-g / react-json-view / #2828

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous