1 files changed, 24 insertions, 0 deletions
diff --git a/apps/mobile/app/signin.tsx b/apps/mobile/app/signin.tsx
index 4f74c331..3dc41a0c 100644
--- a/apps/mobile/app/signin.tsx
+++ b/apps/mobile/app/signin.tsx
@@ -7,6 +7,7 @@ import {
   View,
 } from "react-native";
 import { Redirect, useRouter } from "expo-router";
+import { CustomHeadersModal } from "@/components/CustomHeadersModal";
 import Logo from "@/components/Logo";
 import { TailwindResolver } from "@/components/TailwindResolver";
 import { Button } from "@/components/ui/Button";
@@ -31,6 +32,8 @@ export default function Signin() {
   const [tempServerAddress, setTempServerAddress] = useState(
     "https://cloud.karakeep.app",
   );
+  const [isCustomHeadersModalVisible, setIsCustomHeadersModalVisible] =
+    useState(false);
 
   const emailRef = useRef<string>("");
   const passwordRef = useRef<string>("");
@@ -79,6 +82,10 @@ export default function Signin() {
     return <Redirect href="dashboard" />;
   }
 
+  const handleSaveCustomHeaders = (headers: Record<string, string>) => {
+    setSettings({ ...settings, customHeaders: headers });
+  };
+
   const onSignin = () => {
     if (!tempServerAddress) {
       setError("Server address is required");
@@ -184,6 +191,17 @@ export default function Signin() {
                 </Button>
               </View>
             )}
+            <Pressable
+              onPress={() => setIsCustomHeadersModalVisible(true)}
+              className="mt-1"
+            >
+              <Text className="text-xs text-gray-500 underline">
+                Configure Custom Headers{" "}
+                {settings.customHeaders &&
+                  Object.keys(settings.customHeaders).length > 0 &&
+                  `(${Object.keys(settings.customHeaders).length})`}
+              </Text>
+            </Pressable>
           </View>
           {loginType === LoginType.Password && (
             <>
@@ -264,6 +282,12 @@ export default function Signin() {
           </Pressable>
         </View>
       </TouchableWithoutFeedback>
+      <CustomHeadersModal
+        visible={isCustomHeadersModalVisible}
+        customHeaders={settings.customHeaders || {}}
+        onClose={() => setIsCustomHeadersModalVisible(false)}
+        onSave={handleSaveCustomHeaders}
+      />
     </KeyboardAvoidingView>
   );
 }