fix: Map color scheme names correctly to prevent white structure

Author: AmirMohammad Cheraghali

src/components/ProteinViewer.tsx

@@ -1897,19 +1897,31 @@ export const ProteinViewer = forwardRef<ProteinViewerRef, ProteinViewerProps>(({
                         this.parameters = params;
 
                         // Instantiate the base scheme (fallback)
-                        // We must handle 'standard' or other aliases if necessary, but usually NGL names match
-                        // If currentColoring is not a registered scheme, fallback to 'uniform' (white)
-                        const BaseSchemeClass = window.NGL.ColormakerRegistry.getScheme(baseColoringForScheme);
+                        // Map our internal color names to NGL's scheme names
+                        let nglSchemeName: any = baseColoringForScheme;
+                        if (baseColoringForScheme === 'chainid') {
+                            nglSchemeName = 'chainname';
+                        } else if (baseColoringForScheme === 'structure' || baseColoringForScheme === 'secondary') {
+                            nglSchemeName = 'sstruc';
+                        }
+
+                        const BaseSchemeClass = window.NGL.ColormakerRegistry.getScheme(nglSchemeName);
                         this.baseScheme = BaseSchemeClass ? new BaseSchemeClass(params) : null;
 
                         this.atomColor = function (atom: any) {
                             const custom = atomColorMap.get(atom.index);
                             if (custom !== undefined) return custom;
 
-                            if (this.baseScheme) {
+                            if (this.baseScheme && this.baseScheme.atomColor) {
                                 return this.baseScheme.atomColor(atom);
                             }
-                            return 0xFFFFFF; // Fallback white
+                            // Better fallback: use element coloring instead of white
+                            const ElementScheme = window.NGL.ColormakerRegistry.getScheme('element');
+                            if (ElementScheme) {
+                                const fallbackScheme = new ElementScheme(params);
+                                return fallbackScheme.atomColor(atom);
+                            }
+                            return 0xCCCCCC; // Light gray as last resort
                         };
                     }, schemeId);