Connect the Flutter App

Dependencies in the pubspec.yaml

dependencies:
  supabase_flutter: ^2.0.0
  sembast: ^3.0.0
  sembast_web: ^2.0.0
  connectivity_plus: ^6.0.0
  uuid: ^4.0.0

Use flutter pub add <package> so you get the current compatible versions.

Initialise Supabase in main()

void main() async {
  WidgetsFlutterBinding.ensureInitialized();   // needed before any plugin call
  await Supabase.initialize(
    url: const String.fromEnvironment('SUPABASE_URL'),
    anonKey: const String.fromEnvironment('SUPABASE_KEY'),
  );
  runApp(const Homepage());
}

• WidgetsFlutterBinding.ensureInitialized() prepares the engine so plugins can run before runApp.
• await Supabase.initialize restores any saved session from browser storage and starts listening for the OAuth redirect.
• After this, Supabase.instance.client is available everywhere.

Keep keys out of the source code

Pass them at build time:

flutter run -d chrome --web-port 3000 \
  --dart-define=SUPABASE_URL=https://<PROJECT_REF>.supabase.co \
  --dart-define=SUPABASE_KEY=<publishable-or-anon-key>

flutter build web --release \
  --dart-define=SUPABASE_URL=$SUPABASE_URL \
  --dart-define=SUPABASE_KEY=$SUPABASE_KEY

Set SUPABASE_URL and SUPABASE_KEY as environment variables in your host (for example Vercel).

--dart-define values are compiled into the JavaScript bundle. This keeps keys out of Git history, but it does not hide them from a browser user. That is fine for the public client key, because RLS protects the data. Never use this for the service_role key.

Table name and column names

The repository uses the table name focus_hub:

await _supabase.from('focus_hub').upsert(task.toSupabaseMap());

If you rename the table, change it in TaskRepository and in the table: argument of onPostgresChanges in task_view.dart.

Mobile deep link (only if you build Android/iOS)

Android (android/app/src/main/AndroidManifest.xml, inside <activity>):

<intent-filter>
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data android:scheme="io.supabase.focushub" android:host="login-callback" />
</intent-filter>

iOS (ios/Runner/Info.plist):

<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleURLSchemes</key>
    <array><string>io.supabase.focushub</string></array>
  </dict>
</array>

The scheme and host must equal the redirectTo string in Dart exactly, and that string must be in Supabase's Redirect URLs list.