@7365admin1/layer-common 4.2.5 → 4.2.7-staging.274

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @iservice365/layer-common
 
+## 4.2.6
+
+### Patch Changes
+
+- a7631fe: Remove stray debug `console.log` calls from shipped components, composables, middleware and plugins, and move the ones on failure paths to `console.error`. No behaviour change.
+
 ## 4.2.5
 
 ### Patch Changes
@@ -507,11 +513,11 @@
   `utils/console-tier.ts` + `composables/useConsoleTier.ts` mirror the server's
   own rule from two endpoints the console already calls, unprojected:
 
-                          GET /api/members/user/:user/app/admin    the Seven365 staff membership
-                          GET /api/roles/id/:role                  that membership's role document
+                            GET /api/members/user/:user/app/admin    the Seven365 staff membership
+                            GET /api/roles/id/:role                  that membership's role document
 
-                          owner  = member.type === "admin" && role.type === "admin" && role.default === true
-                          staff  = member.type === "admin" && role.type === "admin"
+                            owner  = member.type === "admin" && role.type === "admin" && role.default === true
+                            staff  = member.type === "admin" && role.type === "admin"
 
   `role.default` is the marker because it is the only property of a platform
   staff role no API caller can set - `role.controller.ts` validates create and

package/components/AddPassKeyToVisitor.vue

@@ -355,7 +355,6 @@ watch(
     );
 
     keyItems.value = [...filteredRawKeys, ...manuallyRemovedKeys];
-    console.log("keyItems: ", keyItems.value);
   },
   { deep: true, immediate: true }
 );

package/components/AttendanceCheckInOutDialog.vue

@@ -189,7 +189,6 @@ const openCamera = async () => {
 
       try {
         await videoElement.value.play();
-        console.log("Camera preview started successfully");
       } catch (playErr) {
         console.error("Error playing video:", playErr);
         throw playErr;

package/components/AttendanceMain.vue

@@ -154,7 +154,6 @@ async function handleRowClick(data: any) {
 }
 
 const onSettingsSaved = async (payload: any) => {
-  console.log("Settings saved:", payload);
   // TODO: Implement API call to save settings
   await getAttendancesRefresh();
 };

package/components/BtnUploadFile.vue

@@ -104,10 +104,8 @@ async function uploadAttachment(e: Event) {
       value.value = res.id as string;
       await emit("upload", res);
     } catch (error) {
-      console.log(error);
+      console.error(error);
     }
-  } else {
-    console.log("No file selected");
   }
   loading.value = false;
 }

package/components/BuildingForm.vue

@@ -414,7 +414,6 @@ async function submit() {
 
     if (prop.mode === "edit") {
 
-      console.log('Updating building with levels:', building.value.levels);
 
       if (JSON.stringify(initialBuildingLevels.value) !== JSON.stringify(building.value.levels)) {
         await batchUpdateLevels(building.value.levels as { _id: string; name: string }[]);

package/components/BuildingUnitFormEdit.vue

@@ -535,7 +535,6 @@ async function submit() {
 const handleUpdateOwner = async ({ person, isOwner }: { person: TPeople; isOwner: boolean }) => {
   const owners = peopleItems.value.filter(p => p.isOwner)
   message.value = ""
-  // console.log('Updating owner status for', person._id, 'to', isOwner)
 
   const userId = person._id ?? null;
 

package/components/BulletinBoardManagement.vue

@@ -304,7 +304,7 @@ async function handleProceedDeleteAnnouncement() {
         }
     } catch (error: any) {
         const errorMessage = error?.response?._data?.message;
-        console.log("[ERROR]", error);
+        console.error("[ERROR]", error);
         showMessage(
             errorMessage || "Something went wrong. Please try again later.",
             "error"

package/components/CameraForm.vue

@@ -288,7 +288,6 @@ camera.value.site = prop.site;
 if (prop.mode === "edit") {
   camera.value = JSON.parse(JSON.stringify(prop.camera));
 }
-console.log("prop.camera", prop?.camera);
 camera.value.site = prop.site;
 camera.value.type = prop.type;
 camera.value.category =

package/components/CameraMain.vue

@@ -521,7 +521,6 @@ const camera = ref<TSiteCamera>({
 });
 
 function handleRowClick(_: any, data: any) {
-  console.log("row clicked", data.item);
   dialogPreview.value = true;
   camera.value = JSON.parse(JSON.stringify(data.item));
 }

package/components/CameraWall.vue

@@ -165,7 +165,7 @@
           v-else
           class="vms__grid"
           :style="{
-            gridTemplateColumns: `repeat(${layout.columns}, minmax(0, 1fr))`,
+            gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))`,
             gridTemplateRows: `repeat(${rows}, minmax(0, 1fr))`,
           }"
         >
@@ -336,6 +336,7 @@
 
 <script setup lang="ts">
 import { computed, onBeforeUnmount, onMounted, ref, watch } from "vue";
+import { useDisplay } from "vuetify";
 
 import {
   capabilityView,
@@ -348,6 +349,7 @@ import {
   pickerView,
   sharedCapabilityNote,
   wallCameras,
+  wallColumns,
   wallLayout,
   wallPageCount,
   wallRows,
@@ -455,7 +457,17 @@ watch(() => props.site, () => {
 
 const layoutKey = ref<TWallLayoutKey>(DEFAULT_WALL_LAYOUT);
 const layout = computed(() => wallLayout(layoutKey.value));
-const dense = computed(() => isDenseLayout(layoutKey.value));
+
+/**
+ * PHONE OVERRIDE. `smAndDown` is Vuetify's own phone/small-tablet cutoff
+ * (<960px) — the same composable `NavigationDrawer.vue` already reads its
+ * breakpoint from. Below it the wall always draws one column, whatever
+ * layout button is selected; the pure column/dense/row rules live in
+ * `camera-wall.ts` (see `wallColumns`) so they stay testable there.
+ */
+const { smAndDown } = useDisplay();
+const columns = computed(() => wallColumns(layoutKey.value, smAndDown.value));
+const dense = computed(() => isDenseLayout(layoutKey.value, smAndDown.value));
 
 const selectedIds = ref<string[]>([]);
 const showPicker = ref(false);
@@ -479,7 +491,7 @@ const tiles = computed(() =>
  * four empty rectangles. Nothing can be done with an empty cell from here
  * anyway: cameras are added in Site Settings.
  */
-const rows = computed(() => wallRows(tiles.value.length, layoutKey.value));
+const rows = computed(() => wallRows(tiles.value.length, layoutKey.value, smAndDown.value));
 
 /**
  * A layout change resizes the page, so the old page NUMBER no longer means

package/components/Carousel.vue

@@ -305,7 +305,6 @@ watchEffect(async (onCleanup) => {
     isConverting.value = false;
     // Replace the entire array at once to avoid "doubling" or partial updates
     mediaItems.value = newMediaItems;
-    console.log("watchEffect mediaItems updated:", mediaItems.value);
   }
 });
 

package/components/Chat/Information.vue

@@ -354,7 +354,7 @@ async function deleteFile(value: string) {
       (file) => file !== value
     );
   } catch (error) {
-    console.log(error);
+    console.error(error);
     showMessage("Failed to delete file", "error");
   }
 }

package/components/Chat/Message.vue

@@ -154,8 +154,9 @@ const quickChatOptions = [
   "We are here to help.",
 ];
 
+// Placeholder: choosing a quick-chat option is not wired to anything yet.
 const selectQuickChat = (msg: string) => {
-  console.log("Quick Chat Selected:", msg);
+  void msg;
 };
 </script>
 

package/components/DrawImage.vue

@@ -152,7 +152,6 @@ async function draw(e: any) {
 const submit = () => {
   canvas.toBlob((blob: any) => {
     const url = URL.createObjectURL(blob);
-    console.log("URL", url);
 
     emit("onSubmit", url, props.imageIdx!);
   });

package/components/Facility/BookingSetup.vue

@@ -939,7 +939,7 @@ const upsertChecklist = () => {
     } else if (Array.isArray(facility.value.securityCheckList)) {
       facility.value.securityCheckList.push(newItem);
     } else {
-      console.log("Error in adding security checklist");
+      console.error("Error in adding security checklist");
     }
   } else {
     isEditing.value = false;
@@ -981,7 +981,6 @@ const confirmRemarks = () => {
 };
 
 const deleteChecklist = (index: string) => {
-  console.log("delete checklist", index);
   selectedIndex.value = index;
   isDeleteItem.value = true;
 };

package/components/FeedbackDetail.vue

@@ -330,7 +330,6 @@ async function handleCompletionFileAdded(file: File) {
     //   }
     // }
 
-    console.log("completionAttachments.value", completionAttachments.value);
   } catch (error) {
     console.error("Error uploading completion file:", error);
     showMessage("Failed to upload file", "error");
@@ -347,7 +346,7 @@ async function handleCompletionFileDeleted(value: string) {
       (file) => file !== value
     );
   } catch (error) {
-    console.log(error);
+    console.error(error);
     showMessage("Failed to delete file", "error");
   }
 }

package/components/FeedbackMain.vue

@@ -927,7 +927,6 @@ const { addFile, deleteFile: _deleteFile } = useFile();
 //       (file) => file !== value
 //     );
 //   } catch (error) {
-//     console.log(error);
 //     showMessage("Failed to delete file", "error");
 //   }
 // }
@@ -943,7 +942,6 @@ const categories = computed(() =>
 );
 
 function tableRowClickHandler(_: any, data: any) {
-  // console.log(data.item);
   selectedFeedback.value = data.item;
   dialogPreview.value = true;
 }

package/components/Input/File.vue

@@ -168,10 +168,6 @@ function selectAttachment() {
 
 function onFileChange() {
   if (files.value.length) {
-    console.log(
-      "onFileChange triggered with files:",
-      files.value.map((f) => f.name)
-    );
 
     const maxFiles = props.maxFiles || 5;
     if (files.value.length > maxFiles) {
@@ -181,7 +177,6 @@ function onFileChange() {
     }
 
     files.value.forEach((file) => {
-      console.log(`Emitting 'add' event for file: ${file.name}`);
       // For each file, we'll also need to store its original name
       // This will be associated with the file URL in the parent component
       emit("add", file);
@@ -192,7 +187,7 @@ function onFileChange() {
 }
 
 function onImageError(file: string) {
-  console.log(`Image error for file: ${file}`);
+  console.error(`Image error for file: ${file}`);
   emit("errored", file);
 }
 

package/components/ListItem.vue

@@ -13,11 +13,11 @@
 <template>
   <v-list-item :class="props.divider ? border : defaultBorder">
     <v-row>
-      <v-col cols="4" class="app-list-row__label">
+      <v-col cols="12" sm="4" class="app-list-row__label">
         <slot name="title"> List Title </slot>
       </v-col>
 
-      <v-col cols="8" class="app-list-row__value">
+      <v-col cols="12" sm="8" class="app-list-row__value">
         <slot name="value"> value </slot>
       </v-col>
     </v-row>

package/components/PasswordConfirmation.vue

@@ -97,7 +97,7 @@ async function handleConfirm() {
 
   } catch (err: any) {
     const errMessage = err?.response?._data?.message || 'Something went wrong. Please try again.';
-    console.log('[ERROR]', err)
+    console.error('[ERROR]', err)
     errorMessage.value = errMessage;
   } finally {
     processingPassword.value = false;

package/components/ScanVisitorQRCode.vue

@@ -77,8 +77,6 @@ const showNotFoundMessage = ref<boolean>(false);
 const errorMessage = ref<string>("");
 
 const handleScanVisitorQRCode = async () => {
-  console.log("startScanner cameraFacingMode", cameraFacingMode.value);
-  console.log("STARTING QR Code Scanner...");
   if (html5QrCodeInstance.value) return;
   const config = { fps: 10, qrbox: { width: 250, height: 250 } };
   html5QrCodeInstance.value = new $Html5Qrcode("reader");

package/components/ServiceProviderMain.vue

@@ -929,7 +929,6 @@ if (!user?._id) return;
   siteId: props.siteId,
 });
 
-console.log("serviceProviders", serviceProviders);
 
     if (serviceProviders?.length) {
       messageServiceProvider.value =
@@ -980,7 +979,6 @@ const canSubmitInvite = computed(() => {
 watch(
   () => serviceProviderInvite.value.email,
   async (value) => {
-    console.log("typing:", value);
     await checkExistingAccount(value);
   }
 );

package/components/SiteSettings.vue

@@ -410,7 +410,6 @@ await useLazyAsyncData(`anpr-settings-${props.siteId}`, async () => {
     site: props.siteId,
     userType: "site",
   });
-  console.log("data", data);
   if (typeof data?.ANPRSwitches == "object") {
     ANPRSwitches.value = data?.ANPRSwitches;
   }
@@ -431,7 +430,6 @@ const saveANPRSettings = async () => {
       updatedBy: props.createdBy,
       userType: "site",
     };
-    console.log("saveANPRSettings data:", data);
     await createUpdateANPRSettings(data);
     show("Saved successfully", "success");
   } catch (error) {

package/components/VisitorForm.vue

@@ -1397,7 +1397,7 @@ async function proceedNonCheckedOutCheckout(visitorId: string) {
     }
   } catch (error: any) {
     const checkoutErrorMessage = error?.response?._data?.message;
-    console.log("[ERROR]", error);
+    console.error("[ERROR]", error);
     errorMessage.value =
       checkoutErrorMessage || "An error occurred while checking out the vehicle.";
   } finally {
@@ -1425,7 +1425,7 @@ async function handleNfcReturnCheckout() {
     }
   } catch (error: any) {
     const checkoutErrorMessage = error?.response?._data?.message;
-    console.log("[ERROR]", error);
+    console.error("[ERROR]", error);
     errorMessage.value =
       checkoutErrorMessage || "An error occurred while returning the NFC card.";
   } finally {
@@ -2085,12 +2085,6 @@ async function submit(options: { skipNonCheckedOutCheck?: boolean } = {}) {
                   );
                   continue;
                 }
-                console.log(
-                  "[QR Print] Sending to printer — accessLevel:",
-                  qrCode.accessLevel,
-                  "liftLevel:",
-                  qrCode.liftAccessLevel
-                );
                 const printResult = await testConnection(
                   vendorId,
                   productId,
@@ -2101,12 +2095,6 @@ async function submit(options: { skipNonCheckedOutCheck?: boolean } = {}) {
                   companyName,
                   address
                 );
-                console.log(
-                  "[QR Print] Print result for card",
-                  qrCode._id,
-                  ":",
-                  printResult
-                );
               }
             }
           }
@@ -2395,10 +2383,6 @@ onMounted(() => {
   currentAutofillSource.value = null;
 
   if (prop.mode === "register" && prop.visitorData) {
-    console.log(
-      "Register mode, prefill visitor data",
-      prop.visitorData?.plateNumber
-    );
     visitor.plateNumber = prop.visitorData?.plateNumber || "";
   }
 });

package/components/VisitorManagement.vue

@@ -2370,7 +2370,7 @@ async function proceedCheckout() {
     }
   } catch (error: any) {
     const errorMessage = error?.response?._data?.message;
-    console.log("[ERROR]", error);
+    console.error("[ERROR]", error);
     showMessage(
       errorMessage || "Something went wrong. Please try again later.",
       "error"

package/components/VisitorPassKeyQRScanner.vue

@@ -72,7 +72,6 @@ const handleScanVisitorQRCode = async () => {
             async (qrCodeMessage: string) => {
                 showNotFoundMessage.value = false;
                 scannedValue.value = qrCodeMessage;
-                console.log(`QR Code scanned: ${qrCodeMessage}`);
                 setTimeout(() => {
                     closeDialog();
                 }, 100);

package/components/WorkOrder/Detail.vue

@@ -199,7 +199,7 @@ async function deleteFile(value: string) {
       (file) => file !== value
     );
   } catch (error) {
-    console.log(error);
+    console.error(error);
     showMessage("Failed to delete file", "error");
   }
 }
@@ -227,7 +227,6 @@ async function submitWorkOrder() {
     let res: Record<string, any> = {};
 
     if (isEditMode.value) {
-      console.log("updating...");
       res = await updateWorkOrder(workOrder.value._id as string, payload);
     } else {
       res = await createWorkOrder(payload);

package/components/WorkOrder/Main.vue

@@ -458,7 +458,7 @@ async function deleteFile(value: string) {
       (file) => file !== value
     );
   } catch (error) {
-    console.log(error);
+    console.error(error);
     showMessage("Failed to delete file", "error");
   }
 }

package/composables/useComment.ts

@@ -114,7 +114,7 @@ export default function useComment() {
         const seenBy = await updateSeenBy(updateSeenIds, currentUser.value?._id);
       }
     } catch (error) {
-      console.log("error :", error);
+      console.error("error :", error);
     } finally {
       isCommentsLoaded.value = false;
     }

package/composables/useKey.ts

@@ -129,7 +129,6 @@ export default function useKey() {
   }
 
   function setKey(data?: TKeyLog) {
-    console.log("data", data);
     keyLog.value = data || new MKeyLog();
   }
 
@@ -329,7 +328,6 @@ export default function useKey() {
       },
     });
     keyList.value = response;
-    console.log("keyList", keyList.value);
     return response;
   }
 
@@ -351,7 +349,6 @@ export default function useKey() {
       },
     });
     keyList.value = response;
-    console.log("keyList", keyList.value);
     return response;
   }
   return {

package/composables/usePassKey.ts

@@ -100,7 +100,6 @@ export default function usePassKey() {
         statuses,
       }) as any;
 
-      console.log("_passKeys.items", _passKeys.items);
 
       passKeys.value = _passKeys.items as TPassKey[];
       pageRange.value = _passKeys.pageRange;

package/composables/useRole.ts

@@ -111,7 +111,7 @@ export default function useRole() {
       const _role = await getRoleById(res.role);
       Object.assign(role.value, _role);
     } catch (error) {
-      console.log(error);
+      console.error(error);
     }
   }
 

package/composables/useUploadFiles.ts

@@ -69,7 +69,7 @@ export default function useUploadFiles() {
         results.push(fileId); // Collect the file ID
         files.value = [];
       } catch (e) {
-        console.log("Error occurred while attaching images.", e);
+        console.error("Error occurred while attaching images.", e);
       }
     }
 

package/composables/useUtils.ts

@@ -407,7 +407,6 @@ export default function useUtils() {
     const desiredDurationInSeconds = 24 * 60 * 60;
     const remainingTimeInSeconds =
       desiredDurationInSeconds - differenceInSeconds;
-    console.log(remainingTimeInSeconds);
     return remainingTimeInSeconds;
   }
 
@@ -497,7 +496,7 @@ export default function useUtils() {
       const response = await fetch(url, { method: "GET" });
       return response.blob();
     } catch (error: any) {
-      console.log(error);
+      console.error(error);
     }
   }
 

package/composables/useVerification.ts

@@ -21,7 +21,6 @@ export default function useVerification() {
   }
 
   function cancelUserInvitation(id: string) {
-    console.log("Calling API to cancel:", id);
     return useNuxtApp().$api<Record<string, any>>(
       `/api/verifications/${id}/cancel`,
       {

package/composables/useWebUsb.ts

@@ -191,19 +191,15 @@ export default function useWebUsb() {
     }
     try {
       let devices = await navigator.usb.getDevices();
-      console.log("[WebUSB] Available devices:", devices.map((d: USBDevice) => `${d.vendorId}:${d.productId}`));
       let device = devices.find(
         (d: USBDevice) => d.vendorId === vendorId && d.productId === productId,
       );
       if (!device) {
-        console.log("[WebUSB] Device not in granted list, requesting permission for", vendorId, productId);
         device = await navigator.usb.requestDevice({
           filters: [{ vendorId, productId }],
         });
       }
-      console.log("[WebUSB] Opening device:", device.vendorId, device.productId);
       await preparePrinterDevice(device);
-      console.log("[WebUSB] Device opened and interface claimed.");
       return device;
     } catch (error: unknown) {
       console.error("Error connecting to USB device:", error);
@@ -511,9 +507,7 @@ export default function useWebUsb() {
     qrSubText?: string,
   ) => {
     try {
-      console.log("[WebUSB] printQrCode start — doorLevel:", doorLevel, "liftLevel:", liftLevel, "company:", companyName, "address:", address);
       const { endpointNumber } = getPrinterConnection(device);
-      console.log("[WebUSB] Using endpoint:", endpointNumber);
 
       const canvas = await createReceiptLayout(
         urlImage,
@@ -524,16 +518,12 @@ export default function useWebUsb() {
         qrHeader,
         qrSubText,
       );
-      console.log("[WebUSB] Canvas created:", canvas.width, "x", canvas.height);
       const rasterData = canvasToRaster(canvas);
-      console.log("[WebUSB] Raster data size:", rasterData.byteLength, "bytes");
 
       await device.transferOut(endpointNumber, rasterData.buffer);
-      console.log("[WebUSB] Raster data sent.");
 
       const CUT = new Uint8Array([0x1d, 0x56, 0x41, 0x10]);
       await device.transferOut(endpointNumber, CUT.buffer);
-      console.log("[WebUSB] Cut command sent.");
 
       return { success: true, message: "QR print sent successfully" };
     } catch (error: unknown) {

package/middleware/01.auth.ts

@@ -6,7 +6,6 @@ export default defineNuxtRouteMiddleware(async (route) => {
 
   const serviceProviderEmail = (route.query.email as string) ?? "";
 
-  console.log(serviceProviderEmail);
 
   if (serviceProviderEmail) {
     useCookie("service-provider-email", cookieConfig).value =

package/middleware/02.org.ts

@@ -9,10 +9,8 @@ export default defineNuxtRouteMiddleware(async (to, from) => {
 
   const { organization, org } = to.params;
 
-  // console.log('org-aut-middleware running', hexSchema.safeParse(organization).success)
   
   if (!hexSchema.safeParse(organization || org).success) {
-    console.log('[02.org] middleware run')
     return navigateTo(
       { name: "require-organization-membership" },
       { replace: true }

package/package.json

@@ -2,7 +2,7 @@
   "name": "@7365admin1/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "4.2.5",
+  "version": "4.2.7-staging.274",
   "author": "7365admin1",
   "main": "./nuxt.config.ts",
   "//files": "What a consumer extending this layer actually loads. Without this npm ships the whole working tree - the changesets, the CI workflows, the render harness in tools/ and any scratch directory that happened to exist at publish time. Nuxt resolves a layer by directory, so every runtime directory below has to stay listed; adding a new top-level runtime directory means adding it here too.",

package/plugins/vuetify.ts

@@ -234,9 +234,7 @@ export default defineNuxtPlugin((app) => {
         // hiddenTabs: ['upload'],
         divider: true,
         // upload(file: File) {
-        //   console.log("file :>> ", file);
         //   const url = URL.createObjectURL(file);
-        //   console.log("mock upload api :>> ", url);
         //   return Promise.resolve(url);
         // },
         upload(file: File) {

package/utils/camera-wall.ts

@@ -101,6 +101,21 @@ export function wallLayout(key: string | undefined) {
   return WALL_LAYOUTS.find((l) => l.key === key) ?? WALL_LAYOUTS[1];
 }
 
+/**
+ * The columns the wall actually draws, after the phone override.
+ *
+ * A phone rendering three columns of a nine-tile wall is the unusable case:
+ * each tile shrinks past the point its status text — or the picture itself —
+ * is legible. So on a phone the wall always draws one column, whatever layout
+ * button is selected; the button still means "this many tiles", it stops
+ * meaning "this many columns" below the phone breakpoint. Tablet and desktop
+ * are untouched — `isPhone` is the caller's own `smAndDown` (or equivalent),
+ * this file has no notion of viewport width itself.
+ */
+export function wallColumns(key: string | undefined, isPhone = false): number {
+  return isPhone ? 1 : wallLayout(key).columns;
+}
+
 /**
  * At three columns a tile is small enough that the chrome starts eating the
  * picture, so the type shrinks and the recorder line loses its timestamp.
@@ -111,9 +126,12 @@ export function wallLayout(key: string | undefined) {
  * from furthest away and the one where a camera is most likely to be missed.
  * Whether a camera is alive is the tile's whole job; it is not the thing that
  * gets cut for room.
+ *
+ * A phone forced to one column (see `wallColumns`) is never dense — a single
+ * full-width tile is the opposite problem.
  */
-export function isDenseLayout(key: string | undefined) {
-  return wallLayout(key).columns >= 3;
+export function isDenseLayout(key: string | undefined, isPhone = false) {
+  return wallColumns(key, isPhone) >= 3;
 }
 
 /* -------------------------------------------------------------------------- */
@@ -302,8 +320,13 @@ export function focusedCamera(
  *
  * Never more rows than the layout would have had, and never fewer than one.
  */
-export function wallRows(count: number, layoutKey: string | undefined): number {
-  const { columns, tiles } = wallLayout(layoutKey);
+export function wallRows(
+  count: number,
+  layoutKey: string | undefined,
+  isPhone = false
+): number {
+  const { tiles } = wallLayout(layoutKey);
+  const columns = wallColumns(layoutKey, isPhone);
   const capped = Math.min(Math.max(0, Math.floor(count)), tiles);
   return Math.min(Math.ceil(tiles / columns), Math.max(1, Math.ceil(capped / columns)));
 }