[bug]: explore data error, when no datasource

Dockerfile

@@ -34,7 +34,7 @@ COPY --from=web_builder /web_workspace/web/static/ web/static
 RUN	CGO_ENABLED=1 GOOS=${TARGETOS:-linux} GOARCH=${TARGETARCH} \
     go build "${LD_FLAGS}" -o linsight ./cmd
 
-FROM centos:latest
+FROM ubuntu:23.10
 WORKDIR /
 COPY --from=go_builder /go_workspace/linsight /usr/bin/linsight
 RUN ln -s /usr/bin/linsight /usr/local/bin/linsight

Dockerfile-gh

@@ -27,7 +27,7 @@ COPY ${GITHUB_WORKSPACE}/web/static/ web/static
 RUN	CGO_ENABLED=1 GOOS=${TARGETOS:-linux} GOARCH=${TARGETARCH} \
     go build "${LD_FLAGS}" -o linsight ./cmd
 
-FROM centos:latest
+FROM ubuntu:23.10
 WORKDIR /
 COPY --from=go_builder /go_workspace/linsight /usr/bin/linsight
 RUN ln -s /usr/bin/linsight /usr/local/bin/linsight

web/package.json

@@ -51,6 +51,7 @@
     "uuid": "^9.0.0"
   },
   "devDependencies": {
+    "@pyroscope/models": "^0.4.7",
     "@types/chart.js": "^2.9.37",
     "@types/lodash-es": "^4.17.6",
     "@types/node": "^20.4.5",

web/src/components/explore/QueryEditor.tsx

@@ -66,7 +66,7 @@ const Targets: React.FC<{ datasource: DatasourceInstance }> = (props) => {
         const refId = `${target.refId}`;
         const datasourceUID = get(target, 'datasource.uid', get(defaultDatasource, 'setting.uid'));
         const datasource = DatasourceStore.getDatasource(`${datasourceUID}`);
-        if (!datasource) {
+        if (!datasource || datasource.setting.uid === MixedDatasource) {
           return null;
         }
         const QueryEditor = datasource.plugin.getQueryEditor();

web/src/features/explore/Explore.tsx

@@ -15,7 +15,7 @@ KIND, either express or implied.  See the License for the
 specific language governing permissions and limitations
 under the License.
 */
-import { Button, Layout } from '@douyinfe/semi-ui';
+import { Button, Card, Empty, Layout } from '@douyinfe/semi-ui';
 import React, { MutableRefObject, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { AddToCharts, AddToDashboard, DatasourceSelectForm, Icon, MetricExplore, TimePicker } from '@src/components';
 import { DatasourceInstance, PanelSetting, Tracker } from '@src/types';
@@ -70,6 +70,22 @@ const ExploreContent: React.FC = () => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [panel]);
 
+  const renderContent = () => {
+    if (!datasource || isEmpty(DatasourceStore.getDatasources(false))) {
+      return (
+        <Card
+          className="linsight-feature"
+          bodyStyle={{ height: 300, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+          <Empty
+            image={<Icon icon="empty" style={{ fontSize: 48 }} />}
+            description="No datasource, please add your first datasource."
+          />
+        </Card>
+      );
+    }
+    return <MetricExplore datasource={datasource} />;
+  };
+
   return (
     <Layout className="linsight-explore">
       <Header className="linsight-feature-header">
@@ -106,7 +122,7 @@ const ExploreContent: React.FC = () => {
           <TimePicker />
         </div>
       </Header>
-      {datasource && <MetricExplore datasource={datasource} />}
+      {renderContent()}
     </Layout>
   );
 };

web/src/features/trace/TraceView.tsx

@@ -28,7 +28,6 @@ import './trace-view.scss';
 import { useSearchParams } from 'react-router-dom';
 
 const { Header } = Layout;
-
 const TraceView: React.FC = () => {
   const [viewType, setViewType] = useState('timeline');
   const [searchParams] = useSearchParams();
@@ -57,6 +56,7 @@ const TraceView: React.FC = () => {
         return <TimelineView traces={cloneDeep(result as Trace[])} />;
     }
   };
+
   const renderIcon = () => {
     switch (viewType) {
       case 'flame':
@@ -65,6 +65,7 @@ const TraceView: React.FC = () => {
         return <IconInheritStroked />;
     }
   };
+
   return (
     <Layout className="trace-view">
       <Header className="linsight-feature-header" style={{ padding: '0 12px' }}>

web/yarn.lock

@@ -589,6 +589,11 @@
   resolved "https://registry.npmjs.org/@pyroscope/flamegraph/-/flamegraph-0.34.0.tgz#c2d2b1ff64ae05bd4e268d88937449bfe1c7b2bd"
   integrity sha512-fi9xSaKGoh77V6MzmSxDh8JAWmKcxsqyedMRovTmrdnIf7MjWS22IQQlBgFjdAo97AfL5bIE+LtmcYzjZcrAXw==
 
+"@pyroscope/models@^0.4.7":
+  version "0.4.7"
+  resolved "https://registry.npmjs.org/@pyroscope/models/-/models-0.4.7.tgz#5b62fd246b1abe091310d0269d5556d888e7cb6f"
+  integrity sha512-Lr25KVedM0hZQ1IpsN35pQeE/oqyfisqiFQaBLkn8b71DhhKEHGp5978rOw2rOqEcIlQqjSGnxUDnkBxBEoTlw==
+
 "@remix-run/[email protected]":
   version "1.3.3"
   resolved "https://registry.npmjs.org/@remix-run/router/-/router-1.3.3.tgz#d6d531d69c0fa3a44fda7dc00b20d49b44549164"