feat: add onboarding with oldmarr import (#1606)

apps/nextjs/src/components/language/current-language-combobox.tsx

@@ -4,9 +4,13 @@ import { useChangeLocale, useCurrentLocale } from "@homarr/translation/client";
 
 import { LanguageCombobox } from "./language-combobox";
 
-export const CurrentLanguageCombobox = () => {
+interface CurrentLanguageComboboxProps {
+  width?: string;
+}
+
+export const CurrentLanguageCombobox = ({ width }: CurrentLanguageComboboxProps) => {
   const currentLocale = useCurrentLocale();
   const { changeLocale, isPending } = useChangeLocale();
 
-  return <LanguageCombobox value={currentLocale} onChange={changeLocale} isPending={isPending} />;
+  return <LanguageCombobox value={currentLocale} onChange={changeLocale} isPending={isPending} width={width} />;
 };

apps/nextjs/src/components/language/language-combobox.tsx

@@ -9,14 +9,17 @@ import { localeConfigurations, supportedLanguages } from "@homarr/translation";
 
 import classes from "./language-combobox.module.css";
 
+import "flag-icons/css/flag-icons.min.css";
+
 interface LanguageComboboxProps {
   label?: string;
   value: SupportedLanguage;
   onChange: (value: SupportedLanguage) => void;
   isPending?: boolean;
+  width?: string;
 }
 
-export const LanguageCombobox = ({ label, value, onChange, isPending }: LanguageComboboxProps) => {
+export const LanguageCombobox = ({ label, value, onChange, isPending, width }: LanguageComboboxProps) => {
   const combobox = useCombobox({
     onDropdownClose: () => combobox.resetSelectedOption(),
   });
@@ -49,6 +52,7 @@ export const LanguageCombobox = ({ label, value, onChange, isPending }: Language
           rightSectionPointerEvents="none"
           onClick={handleOnClick}
           variant="filled"
+          w={width}
         >
           <OptionItem currentLocale={value} localeKey={value} />
         </InputBase>