Support movie covers as avatars

src/App.vue

@@ -18,7 +18,7 @@ loadInstanceInfo()
 
 watch($$(currentUser), () => {
   const title = currentUser ? `@${currentUser.username}` : "Federated social network"
-  document.title = `Mitra | ${title}`
+  document.title = `FediMovies.rocks | ${title}`
 }, { immediate: true })
 </script>
 

src/api/instance.ts

@@ -41,7 +41,7 @@ export interface InstanceInfo {
     },
   },
   login_message: string;
-  blockchains: BlockchainInfo[];
+  blockchains: BlockchainInfo[] | null;
   ipfs_gateway_url: string | null;
 }
 

src/components/Avatar.vue

@@ -32,11 +32,11 @@ const avatarUrl = computed<string>(() => {
 <style scoped lang="scss">
 .avatar {
   background-color: var(--block-background-color);
-  border-radius: 50%;
+  //border-radius: 50%;
   box-sizing: border-box;
 
   img {
-    border-radius: inherit;
+    //border-radius: inherit;
     height: 100%;
     object-fit: cover;
     width: 100%;

src/components/ProfileCard.vue

@@ -78,7 +78,7 @@ $profile-padding: calc($block-inner-padding / 2);
   flex-direction: row;
 
   .avatar {
-    height: $avatar-size;
+    height: $avatar-size * 1.5;
     margin-right: $profile-padding;
     margin-top: calc(-1 * ($profile-padding + $avatar-size / 3));
     min-width: $avatar-size;

src/components/StaticPage.vue

@@ -40,10 +40,10 @@
 }
 
 h1.page-heading {
-  font-size: 90px;
+  font-size: 60px;
   font-weight: bold;
   margin: 0 0 20px;
-  text-transform: uppercase;
+  //text-transform: uppercase;
   word-wrap: break-word;
 }
 

src/composables/instance.ts

@@ -24,7 +24,7 @@ export function useInstanceInfo() {
   }
 
   function getBlockchainInfo(): BlockchainInfo | null {
-    return instance.value?.blockchains[0] || null
+    return instance.value?.blockchains?.[0] ?? null
   }
 
   return {

src/utils/ethereum.ts

@@ -16,7 +16,7 @@ export function ethereumAddressMatch(address1: string, address2: string): boolea
 }
 
 export function hasEthereumWallet(): boolean {
-  return Boolean((window as any).ethereum)
+  return false
 }
 
 export function getWeb3Provider(): Web3Provider {

src/views/About.vue

@@ -5,9 +5,9 @@
       <div class="description static-text" v-html="instance.description"></div>
       <details class="technical-info static-text">
         <summary>Technical Info</summary>
-        mitra version: {{ getMitraVersion(instance.version) }}
+        backend version: {{ getMitraVersion(instance.version) }}
         <br>
-        mitra-web version: {{ APP_VERSION }}
+        web version: {{ APP_VERSION }}
       </details>
     </template>
   </sidebar-layout>
@@ -32,7 +32,7 @@ const { currentUser } = $(useCurrentUser())
 const { instance } = $(useInstanceInfo())
 
 function getMitraVersion(apiVersion: string): string {
-  const match = apiVersion.match(/.+Mitra ([\d.]+)/)
+  const match = apiVersion.match(/.+Reef ([\d.]+)/)
   if (match) {
     return match[1]
   } else {

src/views/Ethereum.vue

@@ -1,15 +1,9 @@
 <template>
   <static-page class="wide">
-    <template #heading>Ethereum</template>
+    <template #heading>No blockchains!</template>
     <template #text>
       <p>
-        You can register on this server with your <a href="https://ethereum.org/en/wallets/find-wallet/?filters=has_explore_dapps" target="_blank" rel="noopener">Ethereum wallet</a>.
-        <a href="https://metamask.io/" target="_blank" rel="noopener">MetaMask</a> is a good choice for beginners.
-        Your wallet address will be stored for authentication purposes and will not be exposed unless you later complete the address verification procedure.
-        In that case, your address will be publicly associated with your account.
-        To protect your privacy, it is recommended that you create a fresh address and don't link it to your other activities.
-        This can be achieved by using an exchange <a href="http://kycnot.me/" target="_blank" rel="noopener">that doesn't require identity verification</a>.
-        For general privacy recommendations, visit <a href="https://www.privacyguides.org/tools/" target="_blank" rel="noopener">PrivacyGuides</a> website.
+        Don't use cryptocurrencies. Thanks!
       </p>
     </template>
   </static-page>

src/views/LandingPage.vue

@@ -10,21 +10,6 @@
         </div>
       </div>
       <div v-if="instance" class="login-form-group">
-        <div class="login-type">
-          <button
-            v-if="!isWalletRequired()"
-            :class="{ active: loginType === 'password' }"
-            @click.prevent="loginType = 'password'; loginErrorMessage = null"
-          >
-            Password
-          </button>
-          <button
-            :class="{ active: loginType === 'eip4361' }"
-            @click.prevent="loginType = 'eip4361'; loginErrorMessage = null"
-          >
-            Ethereum
-          </button>
-        </div>
         <form class="login-form">
           <div v-if="isLoading" class="login-form-loader">
             <loader></loader>
@@ -47,7 +32,7 @@
               Only lowercase letters, numbers and underscores are allowed.
             </div>
           </div>
-          <div class="form-control" v-if="loginType === 'password'">
+          <div class="form-control">
             <input
               id="password"
               type="password"
@@ -64,10 +49,6 @@
               placeholder="Enter the invite code"
             >
           </div>
-          <div class="wallet-required" v-if="loginType === 'eip4361'">
-            <img src="@/assets/forkawesome/ethereum.svg">
-            <router-link :to="{ name: 'ethereum' }">Ethereum Wallet</router-link> is required
-          </div>
           <button
             v-if="isRegistered"
             type="submit"
@@ -132,11 +113,7 @@ let isLoading = $ref(false)
 let loginErrorMessage = $ref<string | null>(null)
 
 function isWalletRequired(): boolean {
-  if (!instance) {
-    return false
-  }
-  const blockchain = getBlockchainInfo()
-  return Boolean(blockchain?.features.gate)
+  return false
 }
 
 watch($$(instance), () => {
@@ -302,10 +279,10 @@ $landing-text-color: #fff;
 }
 
 .instance-title {
-  font-size: 90px;
+  font-size: 60px;
   font-weight: bold;
   margin-bottom: 20px;
-  text-transform: uppercase;
+  //text-transform: uppercase;
   word-wrap: break-word;
 }
 

src/views/Profile.vue

@@ -638,7 +638,7 @@ async function loadFollowListNextPage() {
 @import "../styles/mixins";
 @import "../styles/theme";
 
-$avatar-size: 170px;
+$avatar-size: 185px;
 
 .profile-block {
   @include block-btn;
@@ -683,7 +683,7 @@ $avatar-size: 170px;
   }
 
   .avatar {
-    height: $avatar-size;
+    height: $avatar-size * 1.5;
     margin-right: auto;
     margin-top: calc(-1 * ($avatar-size / 2 + $block-inner-padding));
     min-width: $avatar-size;