Add a ToggleSwitch and use it for SettingsFlag

Also bring in the compact timeline option.

Without minor CSS changes, the old user settings are completely unusable with this change. As such, minimal effort has been put in to have it be useful. Similarly, the changes drop the use of radio groups and the old theme selector was the only one that used it. See the comments for more details on how/why this was mitigated the way it was.

src/components/views/settings/tabs/GeneralSettingsTab.js

@@ -154,6 +154,7 @@ export default class GeneralSettingsTab extends React.Component {
 
     _renderThemeSection() {
         // TODO: Re-enable theme selection once the themes actually work
+        const SettingsFlag = sdk.getComponent("views.elements.SettingsFlag");
         return (
             <div className="mx_SettingsTab_section mx_GeneralSettingsTab_themeSection">
                 <span className="mx_SettingsTab_subheading">{_t("Theme")}</span>
@@ -164,6 +165,7 @@ export default class GeneralSettingsTab extends React.Component {
                     <option value="dharma">{_t("2018 theme")}</option>
                     <option value="status">{_t("Status.im theme")}</option>
                 </Field>
+                <SettingsFlag name="useCompactLayout" level={SettingLevel.ACCOUNT} />
             </div>
         );
     }