[GitHub] [beam] KevinGG commented on a change in pull request #12626: [BEAM-10545] Added the inspector of PCollections and pipelines

[GitBox <gi...@apache.org>]

KevinGG commented on a change in pull request #12626:
URL: https://github.com/apache/beam/pull/12626#discussion_r478632186



##########
File path: sdks/python/apache_beam/runners/interactive/extensions/apache-beam-jupyterlab-sidepanel/src/inspector/InspectableList.tsx
##########
@@ -0,0 +1,99 @@
+// Licensed under the Apache License, Version 2.0 (the 'License'); you may not
+// use this file except in compliance with the License. You may obtain a copy of
+// the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an 'AS IS' BASIS, WITHOUT
+// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+// License for the specific language governing permissions and limitations under
+// the License.
+
+import * as React from 'react';
+
+import { CollapsibleList, SimpleListItem, ListDivider } from '@rmwc/list';
+
+import { InspectableListItem } from './InspectableListItem';
+import { InspectableViewModel } from './InspectableViewModel';
+
+import '@rmwc/list/styles';
+
+export interface IInspectableMeta {
+  name: string;
+  // The id() value of the inspectable item in the kernel.
+  inMemoryId: number;
+  type: string;
+}
+
+interface IKeyedInspectableMeta {
+  [key: string]: IInspectableMeta;
+}
+
+interface IInspectableListProps {
+  inspectableViewModel?: InspectableViewModel;
+  id: string;
+  metadata: IInspectableMeta;
+  pcolls: IKeyedInspectableMeta;
+}
+
+/**
+ * The PCollection sub list of the side list of the InteractiveInspector parent
+ * component.
+ *
+ * Each sub list only contains listing of PCollections for one pipeline.
+ *
+ * The pipeline item functions as a header of the collapsible sub list. It
+ * alters the shared inspectableViewModel of the display area on click to query
+ * and display a graph that is the DOT representation of the pipeline.
+ */
+export class InspectableList extends React.Component<
+  IInspectableListProps,
+  {}
+> {
+  constructor(props: IInspectableListProps) {
+    super(props);
+  }
+
+  render(): React.ReactNode {
+    const pcollListItems = Object.entries(this.props.pcolls).map(

Review comment:
       Thanks! I've moved the logic out into private functions.




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org