github.com/argoproj/argo-cd/v2@v2.10.9/ui/src/app/applications/components/application-resources-diff/individual-diff-section.tsx (about) 1 import * as React from 'react'; 2 import {useState} from 'react'; 3 import {Diff, Hunk} from 'react-diff-view'; 4 import 'react-diff-view/style/index.css'; 5 6 import './application-resources-diff.scss'; 7 8 export interface IndividualDiffSectionProps { 9 file: any; 10 showPath: boolean; 11 whiteBox: string; 12 viewType: string; 13 } 14 15 export const IndividualDiffSection = (props: IndividualDiffSectionProps) => { 16 const {file, showPath, whiteBox, viewType} = props; 17 const [collapsed, setCollapsed] = useState(false); 18 return ( 19 <div className={`${whiteBox} application-component-diff__diff`}> 20 {showPath && ( 21 <p className='application-resources-diff__diff__title'> 22 {file.newPath} 23 <i className={`fa fa-caret-${collapsed ? 'down' : 'up'} diff__collapse`} onClick={() => setCollapsed(!collapsed)} /> 24 </p> 25 )} 26 {!collapsed && ( 27 <Diff viewType={viewType} diffType={file.type} hunks={file.hunks}> 28 {(hunks: any) => hunks.map((hunk: any) => <Hunk className={'custom-diff-hunk'} key={hunk.content} hunk={hunk} />)} 29 </Diff> 30 )} 31 </div> 32 ); 33 };