Feature/added icon model (#76)

[feature]: Added the icons model ( AWS, & GCP ) left nav #40 Here is the list of GCP icons added: # compute -ComputeEngine, -AppEngine, -ContainerEngine, -CloudGPU, -CloudTPU, # networking -CloudCDN, -CloudDNS, -CloudNetwork, # tools -Debugger, -Monitoring, -Trace, -Logging
xerocodee · Mar 17, 2024 · a4df266 · a4df266
2 parents 6f65da3 + 6dbdd80
commit a4df266
Show file tree

Hide file tree

Showing 19 changed files with 873 additions and 26 deletions.
diff --git a/.github/ISSUE_TEMPLATE/bug-report.yaml b/.github/ISSUE_TEMPLATE/bug-report.yaml
@@ -50,8 +50,6 @@ body:
     attributes:
       label: Version
       options:
-        - Cloud
-        - Self-hosted
         - Local
     validations:
       required: true

diff --git a/.github/ISSUE_TEMPLATE/figma-design.yaml b/.github/ISSUE_TEMPLATE/figma-design.yaml
@@ -1,56 +1,56 @@
 name: Figma Design Submission
 description: Submit a design file for review
-title: "[Design]: "
+title: '[Design]: '
 labels: [design, figma, infraboard, xerocodee]
 body:
   - type: markdown
     attributes:
-      value: "Thank you for submitting your design. Please provide the necessary details for review."
+      value: 'Thank you for submitting your design. Please provide the necessary details for review.'
 
   - type: input
     id: design-title
     attributes:
       label: Design Title
-      description: "What is the title of your design?"
-      placeholder: "Enter the title here"
+      description: 'What is the title of your design?'
+      placeholder: 'Enter the title here'
     validations:
       required: true
 
   - type: textarea
     id: design-description
     attributes:
       label: Design Description
-      description: "Please provide a detailed description of your design."
-      placeholder: "Describe your design here"
+      description: 'Please provide a detailed description of your design.'
+      placeholder: 'Describe your design here'
     validations:
       required: true
 
   - type: input
     id: figma-link
     attributes:
       label: Figma File Link
-      description: "Please paste the link to your Figma file."
-      placeholder: "https://www.figma.com/file/..."
+      description: 'Please paste the link to your Figma file.'
+      placeholder: 'https://www.figma.com/file/...'
     validations:
       required: true
 
   - type: checkboxes
     id: terms
     attributes:
       label: Terms and Conditions
-      description: "Please accept the terms and conditions."
+      description: 'Please accept the terms and conditions.'
       options:
-        - label: "I have read and agree to the [Terms of Service](/terms) and [Privacy Policy](/privacy)."
+        - label: 'I have read and agree to the [Terms of Service](/terms) and [Privacy Policy](/privacy).'
 
   - type: dropdown
     id: design-category
     attributes:
       label: Design Category
-      description: "Please select the category your design best fits into."
+      description: 'Please select the category your design best fits into.'
       options:
         - UI/UX
         - Branding
         - Icons
         - Illustrations
     validations:
-      required: true
+      required: true
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -8,9 +8,6 @@ permissions:
   checks: write
   pull-requests: write
 
-env:
-  VITE_INTERNAL: true
-
 jobs:
   lint:
     runs-on: ubuntu-latest
@@ -20,8 +17,6 @@ jobs:
         with:
           node-version: 18
       - run: npm install
-      - run: npx prettier --check .
-      - run: npx prettier --write .
 
   build:
     runs-on: ubuntu-latest

diff --git a/src/assets/gcp/compute/AppEngine.tsx b/src/assets/gcp/compute/AppEngine.tsx
@@ -0,0 +1,53 @@
+import { IconInterface } from '@/assets/iconInterface'
+import React from 'react'
+
+function AppEngine({ className}: IconInterface){
+    return(
+        <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="24px"
+    height="24px"
+    viewBox="0 0 24 24"
+    className={className}
+  >
+    <defs>
+      <style>
+        {
+          ".cls-1{fill:#4285f4;}.cls-1,.cls-2,.cls-3{fill-rule:evenodd;}.cls-2{fill:#aecbfa;}.cls-3{fill:#669df6;}"
+        }
+      </style>
+    </defs>
+    <title>{"Icon_24px_AppEngine_Color"}</title>
+    <g data-name="Product Icons">
+      <g>
+        <path
+          className="cls-1"
+          d="M14.3,10l-1.22,1.22A1.71,1.71,0,0,1,12,14.23a1.74,1.74,0,0,1-1.33-.64L9.45,14.81A3.43,3.43,0,1,0,14.3,10Z"
+        />
+        <path
+          className="cls-2"
+          d="M12,6.26a6.25,6.25,0,1,0,6.25,6.25A6.25,6.25,0,0,0,12,6.26M12,17a4.45,4.45,0,1,1,4.44-4.44A4.44,4.44,0,0,1,12,17"
+        />
+        <path
+          className="cls-3"
+          d="M21.62,11.9l-2.56-.81a7.1,7.1,0,0,1,.17,1.53,7.62,7.62,0,0,1-.08,1.08h2.47a.44.44,0,0,0,.38-.42v-1a.44.44,0,0,0-.38-.42"
+        />
+        <path
+          className="cls-3"
+          d="M12,5.52a7.48,7.48,0,0,1,1.5.15l-.92-2.55c-.07-.22-.21-.38-.42-.38h-.38a.45.45,0,0,0-.42.38l-.8,2.54A7.64,7.64,0,0,1,12,5.52"
+        />
+        <path
+          className="cls-3"
+          d="M4.77,12.62a7.1,7.1,0,0,1,.17-1.53l-2.56.81a.44.44,0,0,0-.38.42v1a.44.44,0,0,0,.38.42H4.85a7.62,7.62,0,0,1-.08-1.08"
+        />
+        <path
+          className="cls-2"
+          d="M12,10a2.5,2.5,0,1,0,2.5,2.5A2.5,2.5,0,0,0,12,10Zm0,3.75a1.25,1.25,0,1,1,1.25-1.25A1.25,1.25,0,0,1,12,13.76Z"
+        />
+      </g>
+    </g>
+  </svg>
+    )
+}
+
+export default React.memo(AppEngine)
diff --git a/src/assets/gcp/compute/CloudGPU.tsx b/src/assets/gcp/compute/CloudGPU.tsx
@@ -0,0 +1,31 @@
+import { IconInterface } from '@/assets/iconInterface'
+import React from 'react'
+
+function CloudGPU({ className }: IconInterface){
+    return(
+        <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="24px"
+    height="24px"
+    viewBox="0 0 24 24"
+    className={className}
+  >
+    <defs>
+      <style>{".cls-1{fill:#4285f4;}"}</style>
+    </defs>
+    <title>{"Icon_24px_GPU_Color"}</title>
+    <g data-name="Product Icons">
+      <path
+        className="cls-1"
+        d="M15.33,2V4.38H13.17V2H10.83V4.38H8.67V2H6.29V4.38A2,2,0,0,0,4.38,6.29H2V8.67H4.38v2.14H2v2.38H4.38v2.14H2v2.38H4.38a2,2,0,0,0,1.91,1.91V22H8.67V19.62h2.16V22h2.34V19.62h2.16V22h2.38V19.62a2,2,0,0,0,1.91-1.91H22V15.33H19.62V13.19H22V10.81H19.62V8.67H22V6.29H19.62a2,2,0,0,0-1.91-1.91V2Zm1.53,15.24H7.14a.38.38,0,0,1-.38-.38V7.14a.38.38,0,0,1,.38-.38h9.72a.38.38,0,0,1,.38.38v9.72A.38.38,0,0,1,16.86,17.24Z"
+      />
+      <polygon
+        className="cls-1"
+        points="12.83 7.54 12.83 11.12 14.79 11.12 11.29 15.98 11.29 12.35 9.22 12.35 12.83 7.54"
+      />
+    </g>
+  </svg>
+    )
+}
+
+export default React.memo(CloudGPU)
diff --git a/src/assets/gcp/compute/CloudTPU.tsx b/src/assets/gcp/compute/CloudTPU.tsx
@@ -0,0 +1,154 @@
+import { IconInterface } from '@/assets/iconInterface'
+import React from 'react'
+
+function CloudTPU({ className }: IconInterface) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="24px"
+      height="24px"
+      viewBox="0 0 24 24"
+      className={className}
+    >
+      <defs>
+        <style>{'.cls-1{fill:#4285f4;}.cls-2{fill:#669df6;}'}</style>
+      </defs>
+      <title>{'Icon_24px_TPU_Color'}</title>
+      <g data-name="Product Icons">
+        <g data-name="colored-32/TPU">
+          <g>
+            <path
+              className="cls-1"
+              d="M6.48,9.62a.37.37,0,1,1-.05-.74l2.3-.32a.37.37,0,0,1,.42.32.38.38,0,0,1-.32.43l-2.3.31Z"
+            />
+            <rect
+              className="cls-1"
+              x={11.11}
+              y={7.43}
+              width={0.75}
+              height={4.36}
+              transform="translate(-1.21 17.55) rotate(-71.93)"
+            />
+            <path
+              id="Shape-2"
+              data-name="Shape"
+              className="cls-1"
+              d="M9.18,9.16H9.07a.37.37,0,0,1-.24-.46l.83-2.84a.37.37,0,0,1,.46-.24.36.36,0,0,1,.26.45L9.54,8.88A.38.38,0,0,1,9.18,9.16Z"
+            />
+            <path
+              id="Shape-3"
+              data-name="Shape"
+              className="cls-1"
+              d="M14.31,10.56a.36.36,0,0,1-.31-.17A.36.36,0,0,1,14,10l1.67-4.23a.38.38,0,0,1,.47-.18.38.38,0,0,1,.23.45l-1.68,4.24A.39.39,0,0,1,14.31,10.56Z"
+            />
+            <rect
+              id="Rectangle-path-2"
+              data-name="Rectangle-path"
+              className="cls-1"
+              x={5.35}
+              y={14.95}
+              width={5.03}
+              height={0.75}
+              transform="translate(-7.84 8.26) rotate(-38.61)"
+            />
+            <polygon
+              id="Rectangle-path-3"
+              data-name="Rectangle-path"
+              className="cls-1"
+              points="14.12 10.71 14.41 10.02 18.05 11.61 17.75 12.29 14.12 10.71"
+            />
+            <polygon
+              id="Rectangle-path-4"
+              data-name="Rectangle-path"
+              className="cls-1"
+              points="13.99 14.59 14.51 14.04 17.74 17.09 17.22 17.63 13.99 14.59"
+            />
+            <rect
+              id="Rectangle-path-5"
+              data-name="Rectangle-path"
+              className="cls-1"
+              x={9.18}
+              y={9}
+              width={0.75}
+              height={4.06}
+              transform="translate(-2 2.12) rotate(-11.48)"
+            />
+            <polygon
+              id="Rectangle-path-6"
+              data-name="Rectangle-path"
+              className="cls-1"
+              points="9.96 13.6 14.06 10 14.56 10.56 10.46 14.16 9.96 13.6"
+            />
+            <polygon
+              id="Rectangle-path-7"
+              data-name="Rectangle-path"
+              className="cls-1"
+              points="13.75 14.22 13.99 10.25 14.74 10.3 14.49 14.27 13.75 14.22"
+            />
+            <circle
+              id="Oval"
+              className="cls-1"
+              cx={10.01}
+              cy={13.82}
+              r={1.36}
+            />
+            <circle
+              id="Oval-2"
+              data-name="Oval"
+              className="cls-1"
+              cx={14.37}
+              cy={10.36}
+              r={1.61}
+            />
+            <circle
+              id="Oval-3"
+              data-name="Oval"
+              className="cls-1"
+              cx={14.36}
+              cy={14.54}
+              r={0.84}
+            />
+            <circle
+              id="Oval-4"
+              data-name="Oval"
+              className="cls-1"
+              cx={9.04}
+              cy={8.67}
+              r={0.99}
+            />
+          </g>
+        </g>
+        <polygon className="cls-2" points="13 3 11 3 11 7 13 7 13 3 13 3" />
+        <polygon className="cls-2" points="17 3 15 3 15 7 17 7 17 3 17 3" />
+        <polygon className="cls-2" points="9 3 7 3 7 7 9 7 9 3 9 3" />
+        <polygon
+          className="cls-2"
+          points="13 17 11 17 11 21 13 21 13 17 13 17"
+        />
+        <polygon
+          className="cls-2"
+          points="17 17 15 17 15 21 17 21 17 17 17 17"
+        />
+        <polygon className="cls-2" points="9 17 7 17 7 21 9 21 9 17 9 17" />
+        <polygon className="cls-2" points="7 11 3 11 3 13 7 13 7 11 7 11" />
+        <polygon className="cls-2" points="7 7 3 7 3 9 7 9 7 7 7 7" />
+        <polygon className="cls-2" points="7 15 3 15 3 17 7 17 7 15 7 15" />
+        <polygon
+          className="cls-2"
+          points="21 11 17 11 17 13 21 13 21 11 21 11"
+        />
+        <polygon className="cls-2" points="21 7 17 7 17 9 21 9 21 7 21 7" />
+        <polygon
+          className="cls-2"
+          points="21 15 17 15 17 17 21 17 21 15 21 15"
+        />
+        <path
+          className="cls-2"
+          d="M18,5H6A1,1,0,0,0,5,6V18a1,1,0,0,0,1,1H18a1,1,0,0,0,1-1V6A1,1,0,0,0,18,5ZM17,16.47a.53.53,0,0,1-.53.53H7.53A.53.53,0,0,1,7,16.47V7.53A.53.53,0,0,1,7.53,7h8.94a.53.53,0,0,1,.53.53Z"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default React.memo(CloudTPU)