Skip to content

Commit 55068ca

Browse files
feat: pass language to code components
1 parent 0fee30a commit 55068ca

14 files changed

Lines changed: 57 additions & 25 deletions

File tree

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
1-
//cc:signin#2;send request
1+
#cc:signin#2;send request
22

3-
//cc:signin#4;respond to client
3+
#cc:signin#4;respond to client
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
//cc:signin#3;updare seesion
1+
#cc:signin#3;updare seesion

src/public/dist/local/bundle/main.bundle.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48010,9 +48010,11 @@ var getNamespaceState = function getNamespaceState(state) {
4801048010
return state.dataBus[namespace];
4801148011
};
4801248012
var getProjectMetadata = Object(reselect__WEBPACK_IMPORTED_MODULE_0__["createSelector"])([getNamespaceState], function (namespaceState) {
48013-
var projectName = namespaceState.projectName;
48013+
var projectName = namespaceState.projectName,
48014+
language = namespaceState.language;
4801448015
return {
48015-
projectName: projectName
48016+
projectName: projectName,
48017+
language: language
4801648018
};
4801748019
});
4801848020
var getSource = Object(reselect__WEBPACK_IMPORTED_MODULE_0__["createSelector"])([getNamespaceState], function (namespaceState) {

src/public/js/components/sideBar/SideBarContainer.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React from 'react';
22
import { connect } from 'react-redux';
33

44
import { getActiveNamespace } from 'core/namespaceIntegration/selectors';
5-
import { getSourceUserChoice, getSource } from 'core/dataBus/selectors';
5+
import { getSourceUserChoice, getSource, getProjectMetadata } from 'core/dataBus/selectors';
66
import { toggleSwitch, selectSideBarTab } from 'core/controlsBus/actions';
77
import { getCheckedState, getValuesState } from 'core/controlsBus/selectors';
88
import SideBar from './component/SideBar';
@@ -22,11 +22,13 @@ const mapStateToProps = (state, props) => {
2222

2323
const { selectedNode } = getSourceUserChoice(state, { namespace });
2424
const { filesMap } = getSource(state, { namespace });
25+
const { language } = getProjectMetadata(state, { namespace });
2526
const { selectedTabInSideBar } = getValuesState(state, props);
2627
const { sideBar, dependenciesDiagramOn, codeCrumbsDiagramOn } = getCheckedState(state);
2728

2829
return {
2930
namespace,
31+
language,
3032
selectedNode,
3133
filesMap,
3234
sideBar,

src/public/js/components/sideBar/component/Code/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,13 +32,13 @@ export default class extends React.Component {
3232
}
3333

3434
render() {
35-
const { code, crumbedLines = [], dependenciesLines = [], limitedHeight } = this.props;
35+
const { language, code, crumbedLines = [], dependenciesLines = [], limitedHeight } = this.props;
3636

3737
// TODO: calc height for .Code based on dependenciesLines - it's not always need to be 300 px!!
3838
return (
3939
<div className={classNames('Code', { limitedHeight })} ref={el => (this.codeRef = el)}>
4040
<SyntaxHighlighter
41-
language="javascript"
41+
language={language}
4242
style={atomOneLight}
4343
showLineNumbers={true}
4444
wrapLines={true}

src/public/js/components/sideBar/component/CrumbsTab/index.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import './index.scss';
1414
const Panel = Collapse.Panel;
1515

1616
const CrumbsTab = props => {
17-
const { flowStepsFiles } = props;
17+
const { language, flowStepsFiles } = props;
1818

1919
return (
2020
<div className={'CrumbsTab'}>
@@ -34,6 +34,7 @@ const CrumbsTab = props => {
3434
key={i}
3535
>
3636
<Code
37+
language={language}
3738
limitedHeight={true}
3839
code={stepFile.file.fileCode || ''}
3940
crumbedLines={[stepFile.crumbNodeLines]}

src/public/js/components/sideBar/component/DependenciesTab/index.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import './index.scss';
1515
const Panel = Collapse.Panel;
1616

1717
const DependenciesTab = props => {
18-
const { selectedNode, filesMap, foldersMap, selectedDependencyEdgeNodes } = props;
18+
const { language, selectedNode, filesMap, foldersMap, selectedDependencyEdgeNodes } = props;
1919

2020
const importedDependencies = filterImportedDependencies(
2121
selectedNode.importedDependencies,
@@ -28,6 +28,7 @@ const DependenciesTab = props => {
2828
<Collapse bordered={false} defaultActiveKey={['0', '1']}>
2929
<Panel header={selectedNode.path} key="0">
3030
<Code
31+
language={language}
3132
limitedHeight={true}
3233
code={selectedNode.fileCode}
3334
dependenciesLines={importedDependencies.map(({ importNodeLines }) => importNodeLines)}
@@ -50,7 +51,7 @@ const DependenciesTab = props => {
5051
);*/
5152
return (
5253
<Panel header={fileNode.path} key={i + 1}>
53-
<Code limitedHeight={true} code={fileNode.fileCode || ''} />
54+
<Code language={language} limitedHeight={true} code={fileNode.fileCode || ''} />
5455
</Panel>
5556
);
5657
})}

src/public/js/components/sideBar/component/FlowChartTab/index.js

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,10 +29,16 @@ const Styles = {
2929
class FlowChartTab extends React.Component {
3030
constructor(props) {
3131
super(props);
32-
this.state = {};
32+
this.state = {
33+
isSupported: props.language === 'javascript'
34+
};
3335
}
3436

3537
componentDidMount() {
38+
if (!this.state.isSupported) {
39+
return;
40+
}
41+
3642
import(/* webpackChunkName: "js2flowchart" */ 'js2flowchart').then(
3743
({ createSVGRender, convertCodeToFlowTree }) => {
3844
this.svgRender = createSVGRender();
@@ -49,7 +55,18 @@ class FlowChartTab extends React.Component {
4955
}
5056

5157
render() {
52-
const { ready } = this.state;
58+
const { ready, isSupported } = this.state;
59+
if (!isSupported) {
60+
return (
61+
<Alert
62+
message={'FlowChart supported for JavaScript code only'}
63+
type="warning"
64+
description="You can file an issue here https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart. Thank you ;)"
65+
showIcon
66+
/>
67+
);
68+
}
69+
5370
if (!ready) {
5471
return (
5572
<div className={'FlowChartLoading'}>
@@ -68,7 +85,7 @@ class FlowChartTab extends React.Component {
6885
<Alert
6986
message={'Oppss.. AST parser failed to parse your code. That dude..'}
7087
type="warning"
71-
description="Well, you can file an issue here https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart"
88+
description="Well.. maybe a bug, you can file an issue here https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart. Thank you ;)"
7289
showIcon
7390
/>
7491
);

src/public/js/components/sideBar/component/SideBar.js

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ const TabPane = Tabs.TabPane;
2121
//TODO: Add slide from right animation
2222
export default ({
2323
namespace,
24+
language,
2425
selectedNode,
2526
filesMap,
2627
onClose,
@@ -51,21 +52,25 @@ export default ({
5152
<Tabs defaultActiveKey={selectedTabInSideBar} onChange={onTabSelect}>
5253
<TabPane tab="Code" key="Code">
5354
<Suspense fallback={null}>
54-
{standaloneNoCode ? <Skeleton /> : <Code namespace={namespace} code={file.fileCode} />}
55+
{standaloneNoCode ? (
56+
<Skeleton />
57+
) : (
58+
<Code namespace={namespace} language={language} code={file.fileCode} />
59+
)}
5560
</Suspense>
5661
</TabPane>
5762
{(dependenciesDiagramOn && (
5863
<TabPane tab="Dependencies" key="Dependencies">
5964
<Suspense fallback={null}>
60-
<DependenciesTab namespace={namespace} />
65+
<DependenciesTab namespace={namespace} language={language} />
6166
</Suspense>
6267
</TabPane>
6368
)) ||
6469
null}
6570
{(codeCrumbsDiagramOn && (
6671
<TabPane tab="Crumbs" key="Crumbs">
6772
<Suspense fallback={null}>
68-
<CrumbsTab namespace={namespace} />
73+
<CrumbsTab namespace={namespace} language={language} />
6974
</Suspense>
7075
</TabPane>
7176
)) ||
@@ -74,6 +79,7 @@ export default ({
7479
<Suspense fallback={null}>
7580
<FlowChartTab
7681
namespace={namespace}
82+
language={language}
7783
fileCode={file.fileCode}
7884
active={selectedTabInSideBar === 'FlowChart'}
7985
/>

src/public/js/components/treeDiagram/component/Node/File.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ export const FileName = props => {
2323
const iconSize = 15;
2424
const nameWidth = name.length * SYMBOL_WIDTH;
2525

26-
// TODO: fix file icon for other languages - have default 'file' icon
26+
// TODO: fix file icon for other languages - have default 'file' icon
2727
const icon = !dependency ? (
2828
<JavaScriptFile x={position.x + 2} y={position.y - 10} height={iconSize} width={iconSize} />
2929
) : (

0 commit comments

Comments
 (0)