Just shipped subscriptions to Sensivika. Free / Pro / Max plans, in-app checkout via DodoPayments — a WebView that intercepts the return URL and polls for activation. Plus a redesigned ProfileScreen, WelcomeScreen, and push notification deep links.

Live build update from today’s stream: We completed several key improvements to the iOS app, including: – Fixed iOS navigation and added missing screens – Created the ProfileScreen and SendPaymentScreen – Updated the Transactions, Swap, and Transfer screens to match Android – Resolved multiple UI alignment issues – iOS design now fully matches Android across all screens – Successfully running on the iPhone 17 Pro simulator

Day 20/30 Profile Screen Today’s design is that part of the app where the user meets themselves. I wanted this screen to feel like a calm personal space clean, intentional, and free of noise. #100DaysOfUIDesign #UIDesign #ProductDesign #ProfileScreen #DesignChallenge #MobileApp

I cooked something 🫠 #DailyUI002 • #dailyui #uidesign #uxui #design #profilescreen

It's astonishing how swiftly Monday has arrived—wishing everyone a joyful start to the week! Today's UI challenge showcases a Profile View Screen🎨✨ #UI #uiux #uidesign #ux #uxdesign #userinterface #userinterfacedesign #profileui #profilescreen #DailyUI

For screens that require data fetching or non-UI business logic, we split the component into a smart one (e.g. ProfileScreen) that fetches data (usually from a custom hook) and renders a pure UI one (e.g. ProfileScreenView) that's rendered in a story with any kind of test data.

🆕 Updates for cosanostr.app ✅ Removed most of logic from UI; ✅ Removed weird second AppBar(); ✅ AlertDialogs now theme consistent. //TODO: The Snackbars are meh. Will customize. Read up on creating ProfileScreen() with pub.dev/documentation/nostr_… package.

With Interface Segregation, we ensure our Roles component can check whether the user is an admin, and allow edits. Our ProfileScreen component does NOT change, because both components’ interfaces are segregated.

In our previous example without Interface Segregation, We may start managing roles within the ProfileScreen, further blurring the boundaries between these two components. Now our ProfileScreen is confused. Why does it need to know how to get and update roles?

Also, because we have clearly identified and segregated the interface boundaries between the ProfileScreen and Roles components, we can achieve another important advantage: A change in the Roles component requirements, does not necessitate a change in the ProfileScreen.

If you look at the previous example again, you will recognize we are doing Prop Drilling, where we are passing getRoles to the ProfileScreen, just so its output can be relayed to the Roles component. Prop Drilling is bad practice, and Interface Segregation helps prevent it.

Now, ProfileScreen depends on an abstraction of Roles, instead of on the getRoles function. Okay, why are we doing all these? There has to be an advantage to adhering to this principle, right? In React, there is a term called Prop Drilling.

The way to resolve this is to figure out the interface boundaries between the two components. Roles: needs to get a user's roles ProfileScreen: needs to display roles As the ProfileScreen component only needs to display roles, we can pass the Roles component as a dependency.

Now, let’s say we extract a Roles component from the above, because we want to simplify things. In this screenshot, we are breaking interface segregation because ProfileScreen does not need to depend on the getRoles function, as it just relays its result to the Roles component.

Interface Segregation says that a construct (so whether a function, class, package, system, etc), should not be forced to rely on a function/method it does not need. Let’s consider that a ProfileScreen component displays a user’s: - name - photo - list of roles.

This is the golden standard for DI. Whatever tool you're using to coordinate data fetching and state management, should allow your components to explicitly declare their dependencies. Here, the ProfileScreen declares `getProfile` as its dependency, and states its interface.

Let's add the CustomProfileScreen as well! This is quite easy and just a case of using the built-in ProfileScreen widget. In this case, we also use an action to navigate back to the sign-in page.

#100DaysOfCode Day 84: Working with #FlutterFire and it's UI package is an absolute bliss 💙 You can get this done in under 15 minutes! Complete register, sign in, forgot password, homescreen and profilescreen all in one go 💪 #Flutter is making app development an absolute joy

flutterfire_uiの ・SignInScreen ・RegisterScreen ・ProfileScreen などを使えば鬼のようにサクッとログイン系の画面を作れる！がしかし... カスタマイズ性がない.. 日本人向けにアプリを作る身としては痛い。 #Flutter firebase.flutter.dev/docs/ui…

Another #DailyUIChallenge. This time it's a #ProfileScreen. Looks like a furnace, doesn't it? 😜 #uidesign #uxdesigner