Density changes.

components/screen-main/screen-main.component.jsx

@@ -27,8 +27,8 @@ import ScreenSettingsComponent from "../screen-settings/screen-settings.componen
 import ScreenSignIn from "../screen-sign-in/screen-sign-in.component";
 import ScreenSplash from "../screen-splash/screen-splash.component";
 import { SplitFactory } from "@splitsoftware/splitio-react-native";
-import * as Updates from 'expo-updates';
-import LogRocket from '@logrocket/react-native';
+import * as Updates from "expo-updates";
+import LogRocket from "@logrocket/react-native";
 
 const ActiveJobStack = createNativeStackNavigator();
 const MoreStack = createNativeStackNavigator();
@@ -164,7 +164,7 @@ export function ScreenMainComponent({
   }, [checkUserSession]);
 
   useEffect(() => {
-    LogRocket.init('idt6oy/imex-mobile', {
+    LogRocket.init("idt6oy/imex-mobile", {
       updateId: Updates.isEmbeddedLaunch ? null : Updates.updateId,
       expoChannel: Updates.channel,
     });

components/screen-media-browser/screen-media-browser.component.jsx

@@ -18,6 +18,7 @@ import JobSpaceAvailable from "../job-space-available/job-space-available.compon
 import UploadProgressLocal from "../upload-progress-local/upload-progress-local.component";
 import UploadDeleteSwitch from "../upload-delete-switch/upload-delete-switch.component";
 import UploadProgress from "../upload-progress/upload-progress.component";
+import { SegmentedButtons } from "react-native-paper";
 // import * as ImagePicker from "expo-image-picker";
 // import { Button } from "react-native-paper";
 // import * as MediaLibrary from "expo-media-library";
@@ -40,6 +41,7 @@ export function ImageBrowserScreen({
 }) {
   const { t } = useTranslation();
   const [uploads, setUploads] = useState(null);
+  const [density, setDensity] = useState(3);
   const [tick, setTick] = useState(0);
   // const [medialLibraryPermissionStatus, requestmediaLibraryPermission] =
   //   ImagePicker.useMediaLibraryPermissions();
@@ -87,10 +89,10 @@ export function ImageBrowserScreen({
       assetsType: [MediaType.photo, MediaType.video],
       minSelection: 1,
       // maxSelection: 3,
-      portraitCols: 4,
-      landscapeCols: 4,
+      portraitCols: density,
+      landscapeCols: density,
     }),
-    []
+    [density]
   );
 
   const widgetNavigator = useMemo(
@@ -175,6 +177,26 @@ export function ImageBrowserScreen({
         <JobSpaceAvailable jobid={selectedCameraJobId} key={`${tick}-space`} />
       )}
       <UploadDeleteSwitch />
+
+      <SegmentedButtons
+        value={density}
+        onValueChange={(value) => {
+          setDensity(value);
+          forceRerender();
+        }}
+        buttons={[
+          {
+            value: 4,
+            label: "Small",
+          },
+          {
+            value: 3,
+            label: "Normal",
+          },
+          { value: 2, label: "Large" },
+        ]}
+      />
+
       {!selectedCameraJobId && (
         <View
           style={{

components/screen-settings/screen-settings.component.jsx

@@ -22,7 +22,7 @@ export default function ScreenSettingsComponent() {
     >
       <Title>
         {t("settings.labels.version", {
-          number: `${Constants.expoConfig.version}(${Application.nativeBuildVersion})`,
+          number: `${Constants.expoConfig.version}(${Application.nativeBuildVersion} - ${Constants.expoConfig.extra.expover})`,
         })}
       </Title>