fix(scene composer): cleanup for polaris css imports & moving interfa…

…ce to component file
awslabs · May 12, 2023 · d244eb5 · d244eb5
1 parent c177802
commit d244eb5
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 13 deletions.
diff --git a/packages/scene-composer/src/interfaces/sceneViewer.ts b/packages/scene-composer/src/interfaces/sceneViewer.ts
@@ -1,8 +1,6 @@
 import { SceneLoader, TwinMakerSceneMetadataModule } from '@iot-app-kit/source-iottwinmaker';
 import { DataStream, TimeQuery, TimeSeriesData, TimeSeriesDataRequest, Viewport } from '@iot-app-kit/core';
 
-import { Direction } from '../layouts/SceneLayout/components/utils';
-
 import { IDataBindingTemplate } from './dataBinding';
 import { SelectionChangedEventCallback, WidgetClickEventCallback } from './components';
 
@@ -11,11 +9,6 @@ export interface DracoDecoderConfig {
   path?: string;
 }
 
-export interface PanelType {
-  direction: typeof Direction.Left | typeof Direction.Right;
-  panels: Record<string, JSX.Element>;
-}
-
 export interface SceneViewerConfig {
   dracoDecoder?: DracoDecoderConfig;
   locale?: string;

diff --git a/packages/scene-composer/src/layouts/SceneLayout/components/FoldableContainer.scss b/packages/scene-composer/src/layouts/SceneLayout/components/FoldableContainer.scss
@@ -1,4 +1,4 @@
-// @use '~/@awsui-design-tokens/polaris.scss';
+@use '@awsui/design-tokens/index.scss' as awsui;
 
 .tm-wrapper-left,
 .tm-wrapper-right {
@@ -17,10 +17,10 @@
   flex-direction: column;
   justify-content: center;
   align-items: center;
-  border-left: 1px solid #414750; // TODO: fix awsui import to use $colorBorderDividerDefault;
-  border-right: 1px solid #414750; // TODO: fix awsui import to use $colorBorderDividerDefault;
+  border-left: 1px solid awsui.$color-border-divider-default; 
+  border-right: 1px solid awsui.$color-border-divider-default; 
 
   &:hover {
-    background-color: #414750; // TODO: fix awsui import to use $colorBackgroundDropdownItemHover;
+    background-color: awsui.$color-background-dropdown-item-hover; 
   }
 }
diff --git a/packages/scene-composer/src/layouts/SceneLayout/components/ScenePanel.tsx b/packages/scene-composer/src/layouts/SceneLayout/components/ScenePanel.tsx
@@ -1,11 +1,15 @@
 import React, { useRef, useState } from 'react';
 
-import { PanelType } from '../../../interfaces';
-
+import { Direction } from './utils';
 import FoldableContainer from './FoldableContainer';
 import TabbedPanelContainer from './TabbedPanelContainer';
 import './ScenePanel.scss';
 
+interface PanelType {
+  direction: typeof Direction.Left | typeof Direction.Right;
+  panels: Record<string, JSX.Element>;
+}
+
 const ScenePanel = (props: PanelType) => {
   const { direction, panels } = props;
   const [isOpen, setIsOpen] = useState<boolean>(false);