Modernizing ui (#73)

Modernizing ui

ui/src/views/jobs/mutation/components/notificationAdapter/NotificationHelpDisplay.jsx

@@ -1,19 +1,14 @@
 import React from 'react';
-import { Accordion, Icon } from 'semantic-ui-react';
+import { Banner } from '@douyinfe/semi-ui';
 
 export default function Help({ readme }) {
-  const [active, setActive] = React.useState(false);
-
   return (
-    <Accordion>
-      <Accordion.Title active={active} index={0} onClick={() => setActive(!active)}>
-        <React.Fragment>
-          <Icon name="dropdown" /> <span className="providerMutator__helpLink"> More information</span>
-        </React.Fragment>
-      </Accordion.Title>
-      <Accordion.Content active={active} className="providerMutator__helpBox">
-        <p dangerouslySetInnerHTML={{ __html: readme }} />
-      </Accordion.Content>
-    </Accordion>
+    <Banner
+      fullMode={false}
+      type="info"
+      closeIcon={null}
+      title={<div style={{ fontWeight: 600, fontSize: '14px', lineHeight: '20px' }}>Information</div>}
+      description={<p dangerouslySetInnerHTML={{ __html: readme }} />}
+    />
   );
 }