prepare for mobile

diegogurpegui · Dec 27, 2023 · 11e8c2b · 11e8c2b
1 parent 6d8466d
commit 11e8c2b
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 7 deletions.
diff --git a/src/options.tsx b/src/options.tsx
@@ -13,7 +13,12 @@ import {
   RelaysConfig
 } from './types';
 import * as Storage from './storage';
-import { getPermissionsString, isHexadecimal, isValidRelayURL } from './common';
+import {
+  getPermissionsString,
+  isHexadecimal,
+  isValidRelayURL,
+  truncatePublicKeys
+} from './common';
 import logotype from './assets/logo/logotype.png';
 import AddCircleIcon from './assets/icons/add-circle-outline.svg';
 import ArrowUpCircleIcon from './assets/icons/arrow-up-circle-outline.svg';
@@ -465,7 +470,11 @@ function Options() {
                   <option value={profilePubKey} key={profilePubKey}>
                     {profilePubKey == ''
                       ? '(new profile)'
-                      : nip19.npubEncode(profilePubKey)}
+                      : truncatePublicKeys(
+                          nip19.npubEncode(profilePubKey),
+                          20,
+                          20
+                        )}
                   </option>
                 ))}
               </select>
@@ -477,22 +486,22 @@ function Options() {
               onClick={handleNewProfileClick}
             >
               <AddCircleIcon />
-              New profile
+              New
             </button>
             <button onClick={handleExportProfileClick}>
               <DownloadIcon />
-              Export profile
+              Export
             </button>
             <button onClick={handleImportProfileClick}>
               <ArrowUpCircleIcon />
-              Import profile
+              Import
             </button>
             <button
               onClick={handleDeleteProfileClick}
               className="button button-danger"
             >
               <TrashIcon />
-              Delete profile
+              Delete
             </button>
           </div>
         </section>

diff --git a/src/storage.ts b/src/storage.ts
@@ -143,6 +143,13 @@ export async function updateProfiles(
     [ConfigurationKeys.PROFILES]: profiles
   });
 
+  // if there's only one profile, then set it as the active one
+  const activePrivateKey = await readActivePrivateKey();
+  if (!activePrivateKey && Object.keys(profiles).length == 1) {
+    const profilePubKey = Object.keys(profiles)[0];
+    await updateActivePrivateKey(profiles[profilePubKey].privateKey);
+  }
+
   return profiles;
 }
 export async function addProfile(

diff --git a/src/style.scss b/src/style.scss
@@ -23,6 +23,11 @@ $button-radius: 0.3em;
 $font-family: 'Prompt', Arial, Helvetica, sans-serif;
 $font-size: 12pt;
 
+$responsive-break-sm: 40em; // Small devices such as large phones (640px and up)
+$responsive-break-md: 48em; // Medium devices such as tablets (768px and up)
+$responsive-break-lg: 64em; // Large devices such as laptops (1024px and up)
+$responsive-break-xl: 80em; // Largest devices such as desktops (1280px and up)
+
 // ****** Font ******
 @font-face {
   font-family: 'Prompt';
@@ -108,7 +113,6 @@ button,
   justify-content: center;
   border: 2px solid $color-primary;
   background-color: $color-primary;
-  color: $color-primary-inv;
   padding: 0.5em 0.7em;
   text-align: center;
   text-decoration: none;
@@ -117,6 +121,11 @@ button,
   font-weight: 500;
   cursor: pointer;
 
+  &,
+  * {
+    color: $color-primary-inv;
+  }
+
   img,
   svg {
     display: inline-block;