feat: add git provider icons, replace instances of these icons used as background

Author: RohitRaj011

src/Assets/IconV2/ic-bitbucket.svg

@@ -15,5 +15,5 @@
  */
 
 export const getContainerRegistryIcon = (registryValue: string): JSX.Element => (
-    <div className={`dc__registry-icon dc__git-logo ${registryValue}`} />
+    <div className={`dc__registry-icon ${registryValue}`} />
 )

src/Assets/IconV2/ic-git.svg

@@ -44,6 +44,7 @@ import { CiPipelineSourceConfig } from './CiPipelineSourceConfig'
 import { HISTORY_LABEL, FILTER_STYLE } from './constants'
 import { statusColor as colorMap } from '../../constants'
 import { DeploymentStatus } from '../StatusComponent'
+import { Icon } from '../Icon'
 
 const SummaryTooltipCard = React.memo(
     ({
@@ -89,7 +90,7 @@ const SummaryTooltipCard = React.memo(
                                     </div>
                                 ) : (
                                     <>
-                                        <div className="dc__git-logo"> </div>
+                                        <Icon name="ic-git" size={24} color={null} />
                                         <div className="flex left column">
                                             <a
                                                 href={createGitCommitUrl(gitMaterialUrl, gitDetail.Commit)}

src/Assets/IconV2/ic-github.svg

@@ -14,18 +14,23 @@
  * limitations under the License.
  */
 
+import { GitProviderType } from '@Common/Constants'
 import { CiPipelineSourceConfig } from '../CICDHistory/CiPipelineSourceConfig'
+import { Icon, IconName } from '../Icon'
 import './gitCommitInfoGeneric.scss'
 
 /* eslint-disable react/prop-types */
-function getGitIcon(repoUrl) {
-    // eslint-disable-next-line no-restricted-syntax
-    for (const gitProvider of ['github', 'gitlab', 'bitbucket']) {
-        if (repoUrl.includes(gitProvider)) {
-            return `${gitProvider}`
-        }
+const getGitIconName = (repoUrl: string): IconName => {
+    if (repoUrl.includes(GitProviderType.GITHUB)) {
+        return 'ic-github'
     }
-    return 'git'
+    if (repoUrl.includes(GitProviderType.GITLAB)) {
+        return 'ic-gitlab'
+    }
+    if (repoUrl.includes(GitProviderType.BITBUCKET)) {
+        return 'ic-bitbucket'
+    }
+    return 'ic-git'
 }
 
 const GitMaterialInfoHeader = ({
@@ -46,7 +51,7 @@ const GitMaterialInfoHeader = ({
             className="git-commit-info-generic__header px-16 py-12 dc__box-shadow fs-12 fw-6 dc__gap-4"
             style={style}
         >
-            <div className={getGitIcon(repoUrl)} />
+            <Icon name={getGitIconName(repoUrl)} size={20} color={null} />
             <div className="flex left left dc__gap-4 fs-13">
                 <div
                     className="repo cn-9 fw-6 dc__mxw-250 dc__ellipsis-right"

src/Assets/IconV2/ic-gitlab.svg

@@ -1,12 +1,16 @@
 // NOTE: This file is auto-generated. Do not edit directly. Run the script `npm run generate-icon` to update.
 
 import { ReactComponent as ICAborted } from '@IconsV2/ic-aborted.svg'
+import { ReactComponent as ICBitbucket } from '@IconsV2/ic-bitbucket.svg'
 import { ReactComponent as ICCancelled } from '@IconsV2/ic-cancelled.svg'
 import { ReactComponent as ICCircleLoader } from '@IconsV2/ic-circle-loader.svg'
 import { ReactComponent as ICClock } from '@IconsV2/ic-clock.svg'
 import { ReactComponent as ICCloseSmall } from '@IconsV2/ic-close-small.svg'
 import { ReactComponent as ICError } from '@IconsV2/ic-error.svg'
 import { ReactComponent as ICFailure } from '@IconsV2/ic-failure.svg'
+import { ReactComponent as ICGit } from '@IconsV2/ic-git.svg'
+import { ReactComponent as ICGithub } from '@IconsV2/ic-github.svg'
+import { ReactComponent as ICGitlab } from '@IconsV2/ic-gitlab.svg'
 import { ReactComponent as ICHeartGreen } from '@IconsV2/ic-heart-green.svg'
 import { ReactComponent as ICHeartRedAnimated } from '@IconsV2/ic-heart-red-animated.svg'
 import { ReactComponent as ICHeartRed } from '@IconsV2/ic-heart-red.svg'
@@ -25,12 +29,16 @@ import { IconBaseProps } from './types'
 
 export const iconMap = {
     'ic-aborted': ICAborted,
+    'ic-bitbucket': ICBitbucket,
     'ic-cancelled': ICCancelled,
     'ic-circle-loader': ICCircleLoader,
     'ic-clock': ICClock,
     'ic-close-small': ICCloseSmall,
     'ic-error': ICError,
     'ic-failure': ICFailure,
+    'ic-git': ICGit,
+    'ic-github': ICGithub,
+    'ic-gitlab': ICGitlab,
     'ic-heart-green': ICHeartGreen,
     'ic-heart-red-animated': ICHeartRedAnimated,
     'ic-heart-red': ICHeartRed,