fix linting errors

src/viewer/helpers/export.ts

@@ -59,14 +59,14 @@ function getDecorator(plugin: PluginContext, root: string): string {
 function extractStructureDataFromState(plugin: PluginContext): { [k: string]: Structure } {
     const content: { [k: string]: Structure } = {};
     const cells = plugin.state.data.select(StateSelection.Generators.rootsOfType(PluginStateObject.Molecule.Structure));
-    for (let i=0; i<cells.length; i++) {
+    for (let i = 0; i < cells.length; i++) {
         const c = cells[i];
         const nodeRef = getDecorator(plugin, c.transform.ref);
         const children = plugin.state.data.select(StateSelection.Generators.byRef(nodeRef))
             .map(child => child.obj!.data);
         const sele = StructureSelection.Sequence(c.obj!.data, children);
         const structure = StructureSelection.unionStructure(sele);
-        const name = `${i+1}-${structure.model.entryId}`;
+        const name = `${i + 1}-${structure.model.entryId}`;
         content[name] = structure;
     }
     return content;
@@ -87,6 +87,6 @@ export function encodeStructureData(plugin: PluginContext): { [k: string]: Uint8
 
 export function downloadAsZipFile(content: { [k: string]: Uint8Array }) {
     const filename = `mol-star_download_${getFormattedTime()}.zip`;
-    const buf = zip(content)
+    const buf = zip(content);
     download(new Blob([buf]), filename);
 }

src/viewer/helpers/preset.ts

@@ -166,9 +166,9 @@ export const RcsbSuperpositionRepresentationPreset = StructureRepresentationPres
 
             const { update, builder, typeParams, color } = reprBuilder(plugin, params);
 
-            let typeProps = {...typeParams}
+            let typeProps = {...typeParams};
             if (expr.type === 'cartoon') {
-                Object.assign(typeProps, {...cartoonProps})
+                Object.assign(typeProps, {...cartoonProps});
             }
 
             Object.assign(representations, {
@@ -184,7 +184,7 @@ export const RcsbSuperpositionRepresentationPreset = StructureRepresentationPres
 
         return representations;
     }
-})
+});
 
 export const RcsbPreset = TrajectoryHierarchyPresetProvider({
     id: 'preset-trajectory-rcsb',
@@ -235,7 +235,6 @@ export const RcsbPreset = TrajectoryHierarchyPresetProvider({
             const _structureProperties = plugin.state.data.build().to(structure)
                 .apply(CustomStructureProperties);
             structureProperties = await _structureProperties.commit();
-        let representation: StructureRepresentationPresetProvider.Result | undefined = undefined;
 
             // adding coloring lookup scheme
             structure.data!.inheritedPropertyData.colors = {};
@@ -245,9 +244,9 @@ export const RcsbPreset = TrajectoryHierarchyPresetProvider({
                     const positions = repr.positions;
                     for (const range of positions) {
                         if (!structure.data!.inheritedPropertyData.colors[range.asymId])
-                            structure.data!.inheritedPropertyData.colors[range.asymId] = new Map()
+                            structure.data!.inheritedPropertyData.colors[range.asymId] = new Map();
                         const residues: number[] = (range.beg && range.end) ? toRange(range.beg, range.end) : [];
-                        if (range.beg && !range.end) residues.push(range.beg)
+                        if (range.beg && !range.end) residues.push(range.beg);
                         for (const num of residues) {
                             structure.data!.inheritedPropertyData.colors[range.asymId].set(num, colorValue);
                         }
@@ -290,8 +289,6 @@ export const RcsbPreset = TrajectoryHierarchyPresetProvider({
         }
 
         if (p.kind === 'feature' && structure?.obj) {
-            const loci = targetToLoci(p.target, structure.obj.data)
-        if (p.kind === 'feature' && structure.obj) {
             const loci = targetToLoci(p.target, structure.obj.data);
             // if target is only defined by chain: then don't force first residue
             const chainMode = p.target.label_asym_id && !p.target.auth_seq_id && !p.target.label_seq_id && !p.target.label_comp_id;
@@ -347,7 +344,7 @@ export function createSelectionExpression(entryId: string, range?: Range): Selec
             label: `${label}`,
             type: 'cartoon',
             tag: 'polymer'
-        }]
+        }];
     } else {
         return [
             {
@@ -386,7 +383,7 @@ export function createSelectionExpression(entryId: string, range?: Range): Selec
                 type: 'ball-and-stick',
                 tag: 'water'
             }
-        ]
+        ];
     }
 }
 
@@ -399,15 +396,15 @@ export const selectionTest = (asymId: string, residues: number[]) => {
     } else {
         return { 'chain-test': MS.core.rel.eq([MS.ammp('label_asym_id'), asymId]) };
     }
-}
+};
 
 export const toRange = (start: number, end: number) => {
-    const b = start < end ? start : end
-    const e = start < end ? end : start
+    const b = start < end ? start : end;
+    const e = start < end ? end : start;
     return [...Array(e - b + 1)].map((_, i) => b + i);
-}
+};
 
 const labelFromProps = (entryId: string, range: Range) => {
-    return entryId +(range.asymId ? `.${range.asymId}` : '') +
+    return entryId + (range.asymId ? `.${range.asymId}` : '') +
         (range.beg && range.end ? `:${range.beg.toString()}-${range.end.toString()}` : '');
-}
+};

src/viewer/helpers/superpose/color.ts

@@ -40,7 +40,7 @@ export function SuperposeColorTheme(ctx: ThemeDataContext, props: {}): ColorThem
             return defaultColorLookup.get(asymId)!;
         }
         return DefaultColor;
-    }
+    };
 
     const color = (location: Location): Color => {
         if (StructureElement.Location.is(location)) {

src/viewer/helpers/superpose/flexible-structure.ts

@@ -28,8 +28,8 @@ const FlexibleStructureFromModel = PluginStateTransform.BuiltIn({
             const { selection } = params;
             if (!selection?.length) return base;
 
-            const selectChains: string[] = []
-            const selectBlocks: Structure[][] = []
+            const selectChains: string[] = [];
+            const selectBlocks: Structure[][] = [];
             for (const p of selection) {
                 if (!selectChains.includes(p.asymId)) {
                     selectChains.push(p.asymId);
@@ -51,12 +51,12 @@ const FlexibleStructureFromModel = PluginStateTransform.BuiltIn({
             const builder = Structure.Builder({ label: base.data.label });
             for (const blocks of selectBlocks) {
                 if (blocks.length === 1) {
-                    const u = blocks[0].units[0]
+                    const u = blocks[0].units[0];
                     builder.addUnit(u.kind, u.model, u.conformation.operator, u.elements, u.traits, u.invariantId);
                 } else {
                     builder.beginChainGroup();
                     for (const b of blocks) {
-                        const u = b.units[0]
+                        const u = b.units[0];
                         builder.addUnit(u.kind, u.model, u.conformation.operator, u.elements, u.traits, u.invariantId);
                     }
                     builder.endChainGroup();
@@ -64,7 +64,7 @@ const FlexibleStructureFromModel = PluginStateTransform.BuiltIn({
             }
 
             const blockStructure = builder.getStructure();
-            return new SO.Molecule.Structure(blockStructure, { label: base.data.label })
+            return new SO.Molecule.Structure(blockStructure, { label: base.data.label });
         });
     },
     dispose({ b }) {

src/viewer/index.ts

@@ -82,19 +82,11 @@ const DefaultViewerProps = {
     volumeStreamingServer: '//maps.rcsb.org/',
 
     backgroundColor: ColorNames.white,
-    showWelcomeToast: true,
-
-    panelVisibility: {
-        selection: false,
-        measurements: true,
-        superposition: false,
-        component: true,
-        volume: false,
-        custom: false
-    }
+    showWelcomeToast: true
 };
 export type ViewerProps = typeof DefaultViewerProps
 
+
 export class Viewer {
     private readonly plugin: PluginContext;
     private readonly modelUrlProviders: ModelUrlProvider[];
@@ -160,12 +152,11 @@ export class Viewer {
                 component: false,
                 volume: true,
                 custom: true,
-            }),
-            visibility: new BehaviorSubject<CollapsedState>({ ...o.panelVisibility })
-        }
+            })
+        };
 
         this.plugin.init();
-        ReactDOM.render(React.createElement(Plugin, { plugin: this.plugin }), target)
+        ReactDOM.render(React.createElement(Plugin, { plugin: this.plugin }), target);
 
         const renderer = this.plugin.canvas3d!.props.renderer;
         PluginCommands.Canvas3D.SetSettings(this.plugin, { settings: { renderer: { ...renderer, backgroundColor: o.backgroundColor } } });

src/viewer/types.ts

@@ -41,21 +41,13 @@ export type CollapsedState = {
     volume: boolean
     custom: boolean
 }
-export type VisibilityState = {
-    selection: boolean
-    measurements: boolean
-    superposition: boolean
-    component: boolean
-    volume: boolean
-    custom: boolean
-}
+
 export interface ViewerState {
     showImportControls: boolean
     showExportControls: boolean
     showSessionControls: boolean
     modelLoader: ModelLoader
     collapsed: BehaviorSubject<CollapsedState>
-    visibility: BehaviorSubject<VisibilityState>
 }
 export function ViewerState(plugin: PluginContext) {
     return plugin.customState as ViewerState;

src/viewer/ui/controls.tsx

@@ -24,21 +24,19 @@ export class StructureTools extends PluginUIComponent {
     }
 
     componentDidMount() {
-        this.subscribe(this.customState.collapsed, () => this.forceUpdate())
-        this.subscribe(this.customState.visibility, () => this.forceUpdate())
+        this.subscribe(this.customState.collapsed, () => this.forceUpdate());
     }
 
     render() {
         const collapsed = this.customState.collapsed.value;
-        const visibility = this.customState.visibility.value;
         return <>
-            {visibility.selection && <StructureSourceControls />}
-            {visibility.measurements && <StructureMeasurementsControls initiallyCollapsed={collapsed.measurements} />}
-            {visibility.superposition && <StructureSuperpositionControls initiallyCollapsed={collapsed.superposition} />}
-            {visibility.component && <StructureComponentControls initiallyCollapsed={collapsed.component} />}
-            {visibility.volume && <VolumeStreamingControls header='Density' initiallyCollapsed={collapsed.volume} />}
-            {visibility.custom && <CustomStructureControls initiallyCollapsed={collapsed.custom} />}
+            <StructureSourceControls />
+            <StructureMeasurementsControls initiallyCollapsed={collapsed.measurements} />
             <StrucmotifSubmitControls initiallyCollapsed={collapsed.strucmotifSubmit} />
+            <StructureSuperpositionControls initiallyCollapsed={collapsed.superposition} />
+            <StructureComponentControls initiallyCollapsed={collapsed.component} />
+            <VolumeStreamingControls header='Density' initiallyCollapsed={collapsed.volume} />
+            <CustomStructureControls initiallyCollapsed={collapsed.custom} />
         </>;
     }
 }