Skip to content

Commit

Permalink
Merge pull request #405 from Kanaries/chore-style-fix
Browse files Browse the repository at this point in the history 
fix: style fix
  • Loading branch information
@ObservedObserver
ObservedObserver authored Jan 26, 2024
2 parents 426183c + efdc30b commit 9777d60
Show file tree
Hide file tree
Showing 4 changed files with 59 additions and 61 deletions.
4 changes: 2 additions & 2 deletions packages/rath-client/src/pages/loginInfo/workspaceRole.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ const StyledDropdown = styled(Dropdown)`

const WorkspaceRole = observer(function WorkspaceRole () {
const { userStore } = useGlobalStore();
const { loggedIn, currentWspName, organization } = userStore;
const { loggedIn, currentWorkspaceName, organization } = userStore;

// const organizations = useMemo(() => info?.organizations ?? [], [info?.organizations]);
const workspaces = organization?.workspaces ?? [];
Expand Down Expand Up @@ -43,7 +43,7 @@ const WorkspaceRole = observer(function WorkspaceRole () {
<StyledDropdown
label={intl.get('user.workspace')}
options={workspaces.map(wsp => ({ key: wsp.name, text: wsp.name }))}
selectedKey={currentWspName}
selectedKey={currentWorkspaceName}
onChange={(_, opt) => opt && userStore.setWspName(opt.key as string)}
/>
</Stack>
Expand Down
65 changes: 32 additions & 33 deletions packages/rath-client/src/pages/semiAutomation/focusZone/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,33 +19,34 @@ const BUTTON_STYLE = { marginRight: '1em', marginTop: '1em' };
const FocusZone: React.FC = () => {
const { semiAutoStore, commonStore, collectionStore, painterStore, editorStore } = useGlobalStore();
const { mainView, showMiniFloatView, fieldMetas, neighborKeys, mainViewSpecSource } = semiAutoStore;
const { dataViewQuery, spec } = mainView;
const { muteSpec } = editorStore;
const appendFieldHandler = useCallback(
(fid: string) => {
if (mainView.dataViewQuery === null) {
if (dataViewQuery === null) {
semiAutoStore.initMainViewWithSingleField(fid);
} else {
semiAutoStore.addMainViewField(fid);
}
},
[semiAutoStore, mainView.dataViewQuery]
[semiAutoStore, dataViewQuery]
);

const editChart = useCallback(() => {
if (mainView.spec) {
commonStore.visualAnalysisInGraphicWalker(mainView.spec);
if (spec) {
commonStore.visualAnalysisInGraphicWalker(spec);
}
}, [mainView.spec, commonStore]);
}, [spec, commonStore]);

const paintChart = useCallback(() => {
if (mainView.spec && mainView.dataViewQuery) {
painterStore.analysisInPainter(mainView.spec, mainView.dataViewQuery);
if (spec && dataViewQuery) {
painterStore.analysisInPainter(spec, dataViewQuery);
}
}, [mainView.spec, mainView.dataViewQuery, painterStore]);
}, [spec, dataViewQuery, painterStore]);

const viewSpec = useMemo(() => {
return mainViewSpecSource === 'custom' ? muteSpec : mainView.spec;
}, [mainView.spec, muteSpec, mainViewSpecSource]);
return mainViewSpecSource === 'custom' ? muteSpec : spec;
}, [spec, muteSpec, mainViewSpecSource]);

const ChartEditButtonProps = useMemo<IContextualMenuProps>(() => {
return {
Expand All @@ -61,21 +62,21 @@ const FocusZone: React.FC = () => {
text: intl.get('megaAuto.commandBar.editInEditor'),
iconProps: { iconName: 'Edit' },
onClick: () => {
if (mainView.spec) {
editorStore.syncSpec(IVisSpecType.vegaSubset, mainView.spec);
if (spec) {
editorStore.syncSpec(IVisSpecType.vegaSubset, spec);
semiAutoStore.changeMainViewSpecSource();
}
},
},
],
};
}, [editChart, editorStore, mainView.spec, semiAutoStore]);
}, [editChart, editorStore, spec, semiAutoStore]);

const handler = useRef<IReactVegaHandler>(null);

return (
<MainViewContainer>
{mainView.dataViewQuery && showMiniFloatView && <MiniFloatCanvas pined={mainView.dataViewQuery} />}
{dataViewQuery && showMiniFloatView && <MiniFloatCanvas pined={dataViewQuery} />}
<div className="vis-container">
<div className="spec">
{mainViewSpecSource === 'custom' && (
Expand All @@ -92,12 +93,12 @@ const FocusZone: React.FC = () => {
/>
)}
</div>
<div className="vis">{mainView.dataViewQuery && mainView.spec && <MainCanvas handler={handler} view={mainView.dataViewQuery} spec={viewSpec} />}</div>
<div className="vis">{dataViewQuery && spec && <MainCanvas handler={handler} view={dataViewQuery} spec={viewSpec} />}</div>
</div>
<hr style={{ marginTop: '1em' }} />
<div className="fields-container">
{mainView.dataViewQuery &&
mainView.dataViewQuery.fields.map((f: IFieldMeta) => (
{dataViewQuery &&
dataViewQuery.fields.map((f: IFieldMeta) => (
<ViewField
onDoubleClick={() => {
semiAutoStore.setNeighborKeys(neighborKeys.includes(f.fid) ? [] : [f.fid]);
Expand All @@ -114,9 +115,9 @@ const FocusZone: React.FC = () => {
<FieldPlaceholder fields={fieldMetas} onAdd={appendFieldHandler} />
</div>
<div className="fields-container">
{mainView.dataViewQuery &&
mainView.dataViewQuery.filters &&
mainView.dataViewQuery.filters.map((f) => {
{dataViewQuery &&
dataViewQuery.filters &&
dataViewQuery.filters.map((f) => {
const targetField = fieldMetas.find((m) => m.fid === f.fid);
if (!targetField) return null;
let filterDesc = `${targetField.name || targetField.fid} ∈ `;
Expand All @@ -140,9 +141,9 @@ const FocusZone: React.FC = () => {
/>
</div>
<div className="fields-container">
{mainView.dataViewQuery &&
mainView.dataViewQuery.encodes &&
mainView.dataViewQuery.encodes.map((f) => {
{dataViewQuery &&
dataViewQuery.encodes &&
dataViewQuery.encodes.map((f) => {
if (f.field === undefined)
return (
<ViewField
Expand All @@ -168,9 +169,9 @@ const FocusZone: React.FC = () => {
/>
);
})}
{mainView.dataViewQuery && (
{dataViewQuery && (
<EncodeCreationPill
fields={mainView.dataViewQuery.fields}
fields={dataViewQuery.fields}
onSubmit={(encode) => {
semiAutoStore.addFieldEncode2MainViewPattern(encode);
}}
Expand All @@ -182,29 +183,27 @@ const FocusZone: React.FC = () => {
style={BUTTON_STYLE}
text={intl.get('megaAuto.commandBar.editing')}
iconProps={{ iconName: 'BarChartVerticalEdit' }}
disabled={mainView.dataViewQuery === null}
disabled={dataViewQuery === null}
menuProps={ChartEditButtonProps}
/>
<ActionButton
style={BUTTON_STYLE}
text={intl.get('megaAuto.commandBar.painting')}
iconProps={{ iconName: 'EditCreate' }}
disabled={mainView.dataViewQuery === null}
disabled={dataViewQuery === null}
onClick={paintChart}
/>
{mainView.dataViewQuery && mainView.spec && (
{dataViewQuery && spec && (
<ActionButton
style={BUTTON_STYLE}
iconProps={{
iconName: collectionStore.collectionContains(fieldMetas, mainView.spec, IVisSpecType.vegaSubset, mainView.dataViewQuery.filters)
iconName: collectionStore.collectionContains(fieldMetas, spec, IVisSpecType.vegaSubset, dataViewQuery.filters)
? 'FavoriteStarFill'
: 'FavoriteStar',
}}
text={intl.get('common.star')}
onClick={() => {
if (mainView.spec && mainView.dataViewQuery) {
collectionStore.toggleCollectState(fieldMetas, mainView.spec, IVisSpecType.vegaSubset, mainView.dataViewQuery.filters);
}
collectionStore.toggleCollectState(fieldMetas, spec, IVisSpecType.vegaSubset, dataViewQuery.filters);
}}
/>
)}
Expand All @@ -224,7 +223,7 @@ const FocusZone: React.FC = () => {
ariaLabel={intl.get('megaAuto.commandBar.download')}
title={intl.get('megaAuto.commandBar.download')}
text={intl.get('megaAuto.commandBar.download')}
disabled={mainView.dataViewQuery === null}
disabled={dataViewQuery === null}
onClick={() => {
handler.current?.exportImage();
}}
Expand Down
41 changes: 20 additions & 21 deletions packages/rath-client/src/pages/semiAutomation/semiEmbed/liteFocusZone.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ const BUTTON_STYLE = { marginRight: '6px', marginTop: '6px' };
const LiteFocusZone: React.FC = (props) => {
const { semiAutoStore, commonStore, collectionStore, painterStore } = useGlobalStore();
const { mainVizSetting, mainView, showMiniFloatView, fieldMetas, neighborKeys } = semiAutoStore;
const { dataViewQuery, spec } = mainView;
const [showActions, setShowActions] = useState(false);
const appendFieldHandler = useCallback(
(fid: string) => {
Expand All @@ -27,49 +28,47 @@ const LiteFocusZone: React.FC = (props) => {
);

const editChart = useCallback(() => {
if (mainView.spec) {
commonStore.visualAnalysisInGraphicWalker(mainView.spec);
if (spec) {
commonStore.visualAnalysisInGraphicWalker(spec);
}
}, [mainView.spec, commonStore]);
}, [spec, commonStore]);

const paintChart = useCallback(() => {
if (mainView.spec && mainView.dataViewQuery) {
painterStore.analysisInPainter(mainView.spec, mainView.dataViewQuery);
if (spec && dataViewQuery) {
painterStore.analysisInPainter(spec, dataViewQuery);
}
}, [mainView.spec, painterStore, mainView.dataViewQuery]);
}, [spec, painterStore, dataViewQuery]);

return (
<MainViewContainer>
{mainView.dataViewQuery && showMiniFloatView && <MiniFloatCanvas pined={mainView.dataViewQuery} />}
{dataViewQuery && showMiniFloatView && <MiniFloatCanvas pined={dataViewQuery} />}
<div className="vis-container">
<Stack style={{ borderRight: '1px solid #eee' }}>
<IconButton
style={BUTTON_STYLE}
text={intl.get('megaAuto.commandBar.editing')}
iconProps={{ iconName: 'BarChartVerticalEdit' }}
disabled={mainView.dataViewQuery === null}
disabled={dataViewQuery === null}
onClick={editChart}
/>
<IconButton
style={BUTTON_STYLE}
text={intl.get('megaAuto.commandBar.painting')}
iconProps={{ iconName: 'EditCreate' }}
disabled={mainView.dataViewQuery === null}
disabled={dataViewQuery === null}
onClick={paintChart}
/>
{mainView.dataViewQuery && mainView.spec && (
{dataViewQuery && spec && (
<IconButton
style={BUTTON_STYLE}
iconProps={{
iconName: collectionStore.collectionContains(fieldMetas, mainView.spec, IVisSpecType.vegaSubset, mainView.dataViewQuery.filters)
iconName: collectionStore.collectionContains(fieldMetas, spec, IVisSpecType.vegaSubset, dataViewQuery.filters)
? 'FavoriteStarFill'
: 'FavoriteStar',
}}
text={intl.get('common.star')}
onClick={() => {
if (mainView.dataViewQuery && mainView.spec) {
collectionStore.toggleCollectState(fieldMetas, mainView.spec, IVisSpecType.vegaSubset, mainView.dataViewQuery.filters);
}
collectionStore.toggleCollectState(fieldMetas, spec, IVisSpecType.vegaSubset, dataViewQuery.filters);
}}
/>
)}
Expand All @@ -95,8 +94,8 @@ const LiteFocusZone: React.FC = (props) => {
/>
</Stack>
<div>
{mainView.dataViewQuery && mainView.spec && (
<MainCanvas view={mainView.dataViewQuery} spec={adviceVisSize(mainView.spec, fieldMetas)} />
{dataViewQuery && spec && (
<MainCanvas view={dataViewQuery} spec={adviceVisSize(spec, fieldMetas)} />
)}
</div>
{mainVizSetting.nlg && (
Expand All @@ -108,8 +107,8 @@ const LiteFocusZone: React.FC = (props) => {
<hr style={{ marginTop: '6px' }} />
{showActions && (
<div className="fields-container">
{mainView.dataViewQuery &&
mainView.dataViewQuery.fields.map((f: IFieldMeta) => (
{dataViewQuery &&
dataViewQuery.fields.map((f: IFieldMeta) => (
<ViewField
key={f.fid}
type={f.analyticType}
Expand All @@ -128,9 +127,9 @@ const LiteFocusZone: React.FC = (props) => {
)}
{showActions && (
<div className="fields-container">
{mainView.dataViewQuery &&
mainView.dataViewQuery.filters &&
mainView.dataViewQuery.filters.map((f) => {
{dataViewQuery &&
dataViewQuery.filters &&
dataViewQuery.filters.map((f) => {
const targetField = fieldMetas.find((m) => m.fid === f.fid);
if (!targetField) return null;
let filterDesc = `${targetField.name || targetField.fid} ∈ `;
Expand Down
10 changes: 5 additions & 5 deletions packages/rath-client/src/store/userStore.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ export default class UserStore {
/** Organization name */
public currentOrgName: string | null = null;
/** Workspace name */
public currentWspName: string | null = null;
public currentWorkspaceName: string | null = null;

public uploadDataSource: (() => void) | null = null;
public uploadingDataSource = false;
Expand All @@ -44,7 +44,7 @@ export default class UserStore {
return this.info?.organizations?.find(org => org.name === this.currentOrgName) ?? null;
}
public get workspace(): IWorkspace | null {
return this.organization?.workspaces?.find(wsp => wsp.name === this.currentWspName) ?? null;
return this.organization?.workspaces?.find(wsp => wsp.name === this.currentWorkspaceName) ?? null;
}

protected effects: (() => void)[] = [];
Expand Down Expand Up @@ -161,15 +161,15 @@ export default class UserStore {
return false;
}
this.currentOrgName = org.name;
const wsp = org.workspaces?.find(which => which.name === this.currentWspName);
const wsp = org.workspaces?.find(which => which.name === this.currentWorkspaceName);
if (!wsp) {
this.currentWspName = null;
this.currentWorkspaceName = null;
}
return true;
}

public setWspName(wspName: string | null) {
this.currentWspName = wspName;
this.currentWorkspaceName = wspName;
}

}

1 comment on commit 9777d60

@vercel
Copy link

@vercel vercel bot commented on 9777d60 Jan 26, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

rath – ./

rath-kanaries.vercel.app
rath-steel.vercel.app
rath-git-master-kanaries.vercel.app
rath.kanaries.net

Please sign in to comment.