added provider regions endpoint

api/src/caching/helpers.ts

@@ -54,6 +54,7 @@ export const cacheKeys = {
   getAuditors: "getAuditors",
   getProviderList: "getProviderList",
   getChainStats: "getChainStats",
+  getProviderRegions: "getProviderRegions",
   getMainnetNodes: "getMainnetNodes",
   getTestnetNodes: "getTestnetNodes",
   getSandboxNodes: "getSandboxNodes",

api/src/providers/githubProvider.ts

@@ -1,8 +1,10 @@
 import { Octokit } from "@octokit/rest";
 import { cacheKeys, cacheResponse } from "@src/caching/helpers";
+import { chainDb } from "@src/db/dbConnection";
 import { ProviderAttributesSchema } from "@src/types/provider";
 import { env } from "@src/utils/env";
 import axios from "axios";
+import { QueryTypes } from "sequelize";
 
 export function getOctokit() {
   const githubPAT = env.AkashlyticsGithubPAT;
@@ -37,3 +39,25 @@ export async function getAuditors() {
 
   return response;
 }
+
+export async function getProviderRegions() {
+  const providerAttributesSchema = await getProviderAttributesSchema();
+  const regions = providerAttributesSchema["location-region"].values;
+
+  let result: { owner: string; location_region: string }[] = await chainDb.query(
+    `SELECT p.owner, pa.value AS location_region
+    FROM public."provider" p
+    JOIN public."providerAttribute" pa ON p.owner = pa.provider
+    WHERE pa.key = 'location-region';`,
+    {
+      type: QueryTypes.SELECT
+    }
+  );
+
+  const res = regions.map((region) => {
+    const providers = result.filter((provider) => provider.location_region === region.key).map((provider) => provider.owner);
+    return { ...region, providers };
+  });
+
+  return res;
+}

api/src/routers/apiRouter.ts

@@ -22,7 +22,7 @@ import { ProviderStatsKey } from "@src/types/graph";
 import { cacheKeys, cacheResponse } from "@src/caching/helpers";
 import axios from "axios";
 import { getMarketData } from "@src/providers/marketDataProvider";
-import { getAuditors, getProviderAttributesSchema } from "@src/providers/githubProvider";
+import { getAuditors, getProviderAttributesSchema, getProviderRegions } from "@src/providers/githubProvider";
 
 export const apiRouter = express.Router();
 
@@ -336,6 +336,14 @@ apiRouter.get(
   })
 );
 
+apiRouter.get(
+  "/provider-regions",
+  asyncHandler(async (req, res) => {
+    const response = await cacheResponse(60 * 5, cacheKeys.getProviderRegions, getProviderRegions);
+    res.send(response);
+  })
+);
+
 apiRouter.post(
   "/pricing",
   express.json(),
@@ -381,6 +389,14 @@ apiRouter.get(
   })
 );
 
+apiRouter.get(
+  "/regions",
+  asyncHandler(async (req, res) => {
+    const regions = await getProviderRegions();
+    res.send(regions);
+  })
+);
+
 apiRouter.get(
   "/getAuditors",
   asyncHandler(async (req, res) => {

deploy-web/src/components/sdl/ImageSelect.tsx

@@ -35,7 +35,7 @@ export const ImageSelect: React.FunctionComponent<Props> = ({ control, currentSe
   const eleRefs = useRef(null);
   const textFieldRef = useRef<HTMLInputElement>(null);
   const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
-  const filteredGpuTemplates = gpuTemplates.filter(x => x.name.includes(currentService.image));
+  const filteredGpuTemplates = gpuTemplates.filter(x => x.name.toLowerCase().includes(currentService.image));
   const open = Boolean(anchorEl) && filteredGpuTemplates.length > 0;
 
   useEffect(() => {
@@ -46,7 +46,7 @@ export const ImageSelect: React.FunctionComponent<Props> = ({ control, currentSe
   // Effect that scrolls active element when it changes
   useLayoutEffect(() => {
     if (selectedTemplate) {
-      eleRefs[selectedTemplate.id].current.scrollIntoView({ behavior: "smooth", block: "start", inline: "nearest" });
+      eleRefs[selectedTemplate.id].current?.scrollIntoView({ behavior: "smooth", block: "start", inline: "nearest" });
     }
   }, [gpuTemplates, selectedTemplate]);