IO-3092 Imgproxy changes, Split client,

components/job-documents/job-documents.component.jsx

@@ -1,4 +1,5 @@
-import React, { useMemo, useState } from "react";
+import axios from "axios";
+import React, { useEffect, useState } from "react";
 import {
   FlatList,
   Image,
@@ -10,12 +11,12 @@ import {
 import env from "../../env";
 import { DetermineFileType } from "../../util/document-upload.utility";
 import MediaCacheOverlay from "../media-cache-overlay/media-cache-overlay.component";
-import { useEffect } from "react";
-import axios from "axios";
 
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import { splitClient } from "../screen-main/screen-main.component";
+
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
   bodyshop: selectBodyshop,
@@ -32,13 +33,16 @@ export function JobDocumentsComponent({ bodyshop, job, loading, refetch }) {
   const [previewVisible, setPreviewVisible] = useState(false);
   const [fullphotos, setFullPhotos] = useState([]);
   const [imgIndex, setImgIndex] = useState(0);
+
+  const useImgproxy = splitClient.getTreatment("Imgproxy");
+
   const onRefresh = async () => {
     return refetch();
   };
 
   useEffect(() => {
     async function getPhotos() {
-      if (bodyshop.localmediatoken === "imgproxy") {
+      if (useImgproxy) {
         const result = await axios.post(
           `${env.API_URL}/media/imgproxy/thumbnails`,
           {
@@ -128,7 +132,11 @@ export function JobDocumentsComponent({ bodyshop, job, loading, refetch }) {
         )}
       />
 
-      <Text>{fullphotos.length}</Text>
+      <Text
+        style={{ textAlign: "center", color: useImgproxy ? "blue" : "black" }}
+      >
+        {fullphotos.length}
+      </Text>
 
       <MediaCacheOverlay
         photos={fullphotos}