Translate to other languages

[KirolosMFahem]

Why don't you add other languages and every one choose his native language

[suesitran]

Yup, planning this since the start of the project, and planning to add a Setting page for user to choose his language. Any suggestion how this Setting page should look like?

[KirolosMFahem]

A dropdown widget in the appbar

[KirolosMFahem]

by asking copilot workspace I got this respond note: that I didn't take a look at the code technically till now since I'm on vacation

To add a dropdown widget in the app bar to change the translated message language, we need to modify the Dart code in this repository. Let's proceed step-by-step:

Identify the main Dart file where the AppBar is defined. Modify this file to include a dropdown widget in the AppBar. Implement the logic to change the translated message language based on the selected option. I'll start by locating the main Dart file.### Integration Steps

Identify AppBar Location: The AppBar is defined in lib/features/chat/ui/public_chat_screen.dart.

Add Dropdown Widget: Insert a DropdownButton widget in the AppBar to select the translation language.

Update Language Handling Code: Modify the locale_support.dart to handle language changes based on dropdown selection.

Implementation Step 1: Modify public_chat_screen.dart Add the DropdownButton to the AppBar.

import 'package:flutter/material.dart';

class PublicChatScreen extends StatelessWidget {
  const PublicChatScreen({super.key});

  @override
  Widget build(BuildContext context) {
    final User? user = FirebaseAuth.instance.currentUser;

    return BlocProvider<ChatCubit>(
      create: (context) => ChatCubit(),
      child: Scaffold(
        appBar: AppBar(
          title: Text(context.locale.publicRoomTitle),
          actions: [
            DropdownButton<String>(
              onChanged: (String? newValue) {
                // Handle language change
                LocaleSupport.changeLanguage(context, newValue);
              },
              items: <String>['en', 'es', 'de', 'fr'].map<DropdownMenuItem<String>>((String value) {
                return DropdownMenuItem<String>(
                  value: value,
                  child: Text(value),
                );
              }).toList(),
            ),
          ],
        ),
        body: Column(
          children: [
            // Existing code
          ],
        ),
      ),
    );
  }
}

Step 2: Modify locale_support.dart Update the language handling logic.

import 'package:flutter/material.dart';

class LocaleSupport {
  static void changeLanguage(BuildContext context, String? languageCode) {
    if (languageCode != null) {
      Locale newLocale = Locale(languageCode);
      MyApp.setLocale(context, newLocale);
    }
  }
}

Step 3: Update MyApp to Support Locale Changes Ensure the main application supports dynamic locale changes.

import 'package:flutter/material.dart';

class MyApp extends StatefulWidget {
  static void setLocale(BuildContext context, Locale newLocale) {
    _MyAppState state = context.findAncestorStateOfType<_MyAppState>()!;
    state.setLocale(newLocale);
  }

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  Locale? _locale;

  void setLocale(Locale locale) {
    setState(() {
      _locale = locale;
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      locale: _locale,
      // Other properties
    );
  }
}

This will add a dropdown in the AppBar to change the translation language dynamically. Verify the changes by running and testing the application.

12 references my_application.cc:11-104 index.html:1-84 AppDelegate.swift:1-13 win32_window.cpp:41-151 public_chat_screen.dart:1-79 l10n.yaml:1-3 README.md:1-5 index.js:1-95 l10n.yaml:1-3 chat_bubble_widget.dart:1-120 CMakeLists.txt:1-83 main.cpp:1-43

[suesitran]

Actually i'm thinking of a different approach.

I'm thinking to write a chatbot, and let user chat to it to provide feedback, have fun, or request their preferred language.

Initial language before user set any preferred language is current system locale, by using Platform.localeName, and fallback locale is English

User can then start to chat in any language he prefers, and if that language is not English, save it in database. May need to use FunctionCall to save user's setting to database

[duong2417]

The two suggestions above are very good, so I think we should combine them, but using a 'popup' instead of ‘dropdown’ to add a language search box at the top. About the chatbot, every time we change the language, we have to write a sentence like ‘change the language to Japanese...’ - that takes more time, but the chatbot is useful for many tasks, not just for selecting languages as Suesi mentioned so that it's also a great option. The demo of popup:

[KirolosMFahem]

Sometimes chatbots are... lets say it's too linear

unless you use LLMs like Gemma or Llama and in that case, you'll not need Google translate

[suesitran]

I’m currently using Gemini pro, but it’s not very smart when detecting function calls needed, so a list of languages to select from might be a good fallback option

[thenartus]

I asked Gemini for a list of all spoken languages in the work, and here is the answer;

Providing a comprehensive list of all human languages is challenging due to the vast number and their ongoing evolution. Many languages are spoken by small groups and may not have been documented extensively. However, you can find a detailed and regularly updated list on the Ethnologue website: https://www.sil.org/about/endangered-languages/languages-of-the-world Ethnologue is a global reference work cataloging the world's known living languages and provides information about their geographic distribution, number of speakers, and language family affiliations. Would you like me to provide a list of the most widely spoken languages or languages from a specific region?

[KirolosMFahem]

Since you work with Gemini pro-1.5 using vertex ai or ai studio, I assume you can make a template prompt to translate the chat

[duong2417]

Here is my idea: https://cosplaycodeduong.codemagic.app/#home