From 0bdb863ffe93adaf1195297512ef10eb6d587377 Mon Sep 17 00:00:00 2001
From: Mactavish Cui <MactavishCui@163.com>
Date: Fri, 10 Jan 2025 10:29:17 +0800
Subject: [PATCH] [Optimization-4134][Web] Optimization home page icon and job
 detail lineage under dark theme (#4135)

---
 dinky-web/src/components/Icons/HomeIcon.tsx              | 4 ----
 .../src/pages/DevOps/JobDetail/JobLineage/index.tsx      | 9 ++++++++-
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/dinky-web/src/components/Icons/HomeIcon.tsx b/dinky-web/src/components/Icons/HomeIcon.tsx
index a7350c0230..1390e8c0dd 100644
--- a/dinky-web/src/components/Icons/HomeIcon.tsx
+++ b/dinky-web/src/components/Icons/HomeIcon.tsx
@@ -33,10 +33,6 @@ export const ClusterInstanceIcon = (props: any) => {
             version='1.1'
             xmlns='http://www.w3.org/2000/svg'
           >
-            <path
-              d='M44.2368 0h935.5264c24.4224 0 44.2368 19.8144 44.2368 44.2368v935.5264a44.2368 44.2368 0 0 1-44.2368 44.2368H44.2368A44.2368 44.2368 0 0 1 0 979.7632V44.2368C0 19.8144 19.8144 0 44.2368 0z'
-              fill='#FFFFFF'
-            ></path>
             <path
               d='M629.4528 924.8256H397.312a285.7472 285.7472 0 0 1-251.5968-153.344 284.16 284.16 0 0 1-30.0032-176.9984c0-2.304 0.768-4.6592 1.1776-6.9632l1.024-5.3248 1.536 1.536a4.352 4.352 0 0 1 1.28 2.4064c0.8192 2.56 1.536 5.2224 2.304 7.7824 1.5872 5.4784 3.2256 11.1616 5.12 16.384 14.9504 41.472 36.9664 80.0256 65.024 114.0224a14.4896 14.4896 0 0 1 2.56 4.6592A180.3776 180.3776 0 0 0 247.808 808.448c24.576 21.6576 53.504 37.888 84.8896 47.5136a254.2592 254.2592 0 0 1-57.6-34.048 186.2144 186.2144 0 0 1-60.7744-81.1008 14.848 14.848 0 0 1-0.5632-11.264 34.816 34.816 0 0 0 1.2288-4.4032c0-1.024 0.5632-2.048 0.9216-3.072 5.2224-19.0464 15.5136-36.352 29.7984-50.176 14.08-12.6976 30.976-21.8624 49.3568-26.7264 19.3024-5.12 38.912-8.704 58.7776-10.6496l8.192-1.024c10.9056-1.4336 21.9136-3.072 32.9728-4.7104l6.4-1.024 7.2704-1.3824 5.888-1.28-1.536 2.7136v0.512a166.4 166.4 0 0 0-25.088 37.2736 5.2736 5.2736 0 0 1-2.9696 2.56l-4.3008 1.3824c-4.5568 1.6896-9.216 3.0208-13.9264 3.9936-5.12 1.024-10.3424 1.7408-15.4624 2.4576-5.12 0.768-8.192 1.1776-12.1856 1.8944-11.7248 1.536-22.784 6.1952-32.1024 13.4656a40.8064 40.8064 0 0 1 5.376-1.024 42.9568 42.9568 0 0 0 7.3216-1.4336 129.024 129.024 0 0 1 43.264-6.4H380.4672l-0.4096 1.4848a184.2176 184.2176 0 0 0 1.024 116.1216 202.752 202.752 0 0 1-3.072-71.68 151.296 151.296 0 0 1 45.1584-88.4736 219.4432 219.4432 0 0 1 65.28-42.1888 411.8016 411.8016 0 0 1 70.5536-22.016l4.352-1.024c16.4864-3.9424 32.9216-8.192 49.408-12.8a158.6176 158.6176 0 0 0 71.68-43.3664 146.688 146.688 0 0 1 59.7504-46.8992 4.9152 4.9152 0 0 0 1.8944-1.792 78.848 78.848 0 0 1 28.16-28.16 14.0288 14.0288 0 0 1 16.4352 1.3312c1.0752 0.9216 2.1504 1.792 3.072 2.7136a48.64 48.64 0 0 1 9.9328 15.2576 1.7408 1.7408 0 0 0 1.536 1.1264c2.9184 0 5.7856 0.768 8.7552 1.3312a106.752 106.752 0 0 1 87.3472 95.6928v3.9936c0.256 3.072 0.8704 6.144 1.792 9.0624 1.3312 3.6864 2.9184 7.3216 4.7616 10.8032l2.2528 4.6592 1.8944 4.096c1.6384 3.1744 3.072 6.4512 4.352 9.7792 2.048 5.0176 2.2528 10.496 0.7168 15.6672-0.6656 2.2016-2.048 2.56-2.7648 2.56a3.584 3.584 0 0 1-1.8944-0.6144 30.6176 30.6176 0 0 1-3.7376-2.6624l-1.792-1.4336-2.2016-1.1264a32.9216 32.9216 0 0 0-4.5568-3.2768 3.7888 3.7888 0 0 0-1.792-0.512 3.4816 3.4816 0 0 0-1.7408 0.512l2.304 2.048c4.0448 3.5328 8.192 7.168 11.9296 10.752 0.8704 0.8704 1.3824 2.048 1.3312 3.2768a27.4432 27.4432 0 0 1-7.4752 18.3808 24.7296 24.7296 0 0 1-17.92 8.192 18.2784 18.2784 0 0 1-4.2496 0 4.8128 4.8128 0 0 1-2.8672 4.608 81.92 81.92 0 0 1-39.424 10.6496h-2.048a55.808 55.808 0 0 0-27.7504 8.192 40.3456 40.3456 0 0 1-9.216 3.9424 118.272 118.272 0 0 1-24.6784 3.4304c3.4816 0.512 7.0144 0.7168 10.496 0.6656h12.3392c1.28-0.0512 2.5088 0.1536 3.6352 0.5632 6.912 2.816 13.6704 6.2464 19.968 9.4208 0.9728 0.5632 2.048 0.8704 3.072 0.9216a3.7376 3.7376 0 0 0 1.3312 0l1.8944-0.6656c3.4816-1.3312 7.0144-2.6112 10.4448-4.1984 6.912-3.2768 14.4384-5.12 22.0672-5.2224a37.4784 37.4784 0 0 1 20.736 4.864c2.9696 1.536 5.0688 4.4032 5.6832 7.68l0.5632 0.7168 1.8432 1.536 1.9456 1.6896c3.7888 3.3792 5.6832 8.3456 5.12 13.312 0 1.536-0.512 4.9664-3.4816 4.9664a8.2432 8.2432 0 0 1-3.4304-1.024l-1.7408-0.768 4.3008 2.7648c3.328 2.2528 5.12 6.144 4.7616 10.1888a21.9648 21.9648 0 0 1-21.4016 19.0976 14.4384 14.4384 0 0 1-3.7888-0.4096 13.1584 13.1584 0 0 1-9.3696-5.8368h-2.2528a41.3184 41.3184 0 0 0-5.9904 0h-0.5632a46.848 46.848 0 0 1-14.8992 1.536l-4.9664-1.1264h-1.2288a51.6096 51.6096 0 0 1-9.1136 17.152c-9.728 12.0832-22.9888 20.992-37.888 25.4464a120.32 120.32 0 0 1-37.5808 5.7344c-7.2192 0-14.4384-0.512-21.5552-1.536a72.6528 72.6528 0 0 1-60.672-47.2064 123.392 123.392 0 0 1-4.3008-13.9264 164.352 164.352 0 0 0-1.8944-6.8096 144.64 144.64 0 0 0-13.2608-31.6416 93.3376 93.3376 0 0 0-37.888-37.8368 85.1968 85.1968 0 0 0-40.192-9.8304c-6.1952 0-12.3904 0.512-18.5344 1.6384l-3.84 0.8192c4.4032 0 8.704 0 13.056 0.8192a124.928 124.928 0 0 1 54.1696 18.2272c19.8656 11.3664 34.4576 30.0544 40.6528 52.0704 3.2256 12.1856 7.7312 24.0128 13.4144 35.2768 3.5328 7.5776 8.1408 14.592 13.6704 20.8384 9.5232 9.6768 21.5552 16.4352 34.816 19.5584l12.3392 3.6864c2.304 0.768 4.096 2.56 4.864 4.864a32.7168 32.7168 0 0 1 1.7408 18.6368 54.2208 54.2208 0 0 1-13.312 25.7536c-5.6832 6.0928-12.2368 11.3664-19.4048 15.7184a107.52 107.52 0 0 0-9.5232 7.2192 9.6768 9.6768 0 0 0-3.584 8.192c0 4.864 0.512 5.0176 1.4336 5.0176a16.4864 16.4864 0 0 0 3.8912-0.9216l2.7648-1.1264 5.6832-2.4064 9.728-4.1472a54.784 54.784 0 0 1 20.6336-4.4544c3.584 0 7.168 0.512 10.6496 1.3312 11.776 2.048 21.2992 10.5984 24.6784 22.016a9.5744 9.5744 0 0 1-0.512 8.192 5.6832 5.6832 0 0 1-4.4032 2.6624 6.0928 6.0928 0 0 1-3.9424-2.56 3.5328 3.5328 0 0 1-0.9216-2.2016v-0.7168a15.0528 15.0528 0 0 0-4.9664-8.704 27.648 27.648 0 0 1 5.6832 18.2784 11.52 11.52 0 0 1-12.0832 11.264h-0.9216a4.2496 4.2496 0 0 1-4.4032-3.8912v-9.2672-5.12a8.192 8.192 0 0 0-6.5024-7.3216h-0.8704a7.3728 7.3728 0 0 1 2.9184 2.8672 32.768 32.768 0 0 1 3.1744 7.4752c2.048 5.5296 0.1024 11.776-4.7616 15.1552a20.992 20.992 0 0 1-11.6736 2.7136 55.3984 55.3984 0 0 1-12.288-1.8944l-1.9456-0.512a44.1856 44.1856 0 0 0-10.2912-1.28 42.0352 42.0352 0 0 0-8.192 1.024h-1.28c-18.9952 3.584-38.2976 5.4784-57.6 5.632l-4.096 0.0512z'
               fill='#E65270'
diff --git a/dinky-web/src/pages/DevOps/JobDetail/JobLineage/index.tsx b/dinky-web/src/pages/DevOps/JobDetail/JobLineage/index.tsx
index 15eea331f6..fcdfeea05a 100644
--- a/dinky-web/src/pages/DevOps/JobDetail/JobLineage/index.tsx
+++ b/dinky-web/src/pages/DevOps/JobDetail/JobLineage/index.tsx
@@ -24,6 +24,8 @@ import { l } from '@/utils/intl';
 import { Card, Result } from 'antd';
 import React, { useEffect } from 'react';
 import { Lineage } from '@/pages/DataStudio/Toolbar/Service/Lineage';
+import { useTheme } from "@/hooks/useThemeValue";
+import { DataStudioContext } from '@/pages/DataStudio/DataStudioContext';
 
 const JobLineage = (props: { jobDetail: { id: number } }) => {
   const {
@@ -34,6 +36,9 @@ const JobLineage = (props: { jobDetail: { id: number } }) => {
     tables: [],
     relations: []
   });
+
+  const theme = useTheme() as 'realDark' | 'light';
+
   const queryLineageData = () => {
     queryDataByParams(API_CONSTANTS.JOB_INSTANCE_GET_LINEAGE, { id: jobInstanceId }).then((res) =>
       setLineageData(res as LineageDetailInfo)
@@ -52,7 +57,9 @@ const JobLineage = (props: { jobDetail: { id: number } }) => {
         style={{ height: parent.innerHeight - 180 }}
       >
         {lineageData && (lineageData.tables.length !== 0 || lineageData.relations.length !== 0) ? (
-          <Lineage data={lineageData} />
+            <DataStudioContext.Provider value={{ theme: theme }}>
+              <Lineage data={lineageData} />
+            </DataStudioContext.Provider>
         ) : (
           <Result style={{ height: '100%' }} status='warning' title={l('lineage.getError')} />
         )}