show output settings at all times

frontend/src/App.tsx

@@ -186,12 +186,13 @@ function App() {
             <SettingsDialog settings={settings} setSettings={setSettings} />
           </div>
 
-          {appState === AppState.INITIAL && (
           <OutputSettingsSection
             outputSettings={outputSettings}
             setOutputSettings={setOutputSettings}
+            shouldDisableUpdates={
+              appState === AppState.CODING || appState === AppState.CODE_READY
+            }
           />
-          )}
 
           {IS_RUNNING_ON_CLOUD && !settings.openAiApiKey && <OnboardingNote />}
 

frontend/src/components/OutputSettingsSection.tsx

@@ -81,15 +81,20 @@ function generateDisplayString(settings: OutputSettings) {
 interface Props {
   outputSettings: OutputSettings;
   setOutputSettings: React.Dispatch<React.SetStateAction<OutputSettings>>;
+  shouldDisableUpdates?: boolean;
 }
 
-function OutputSettingsSection({ outputSettings, setOutputSettings }: Props) {
+function OutputSettingsSection({
+  outputSettings,
+  setOutputSettings,
+  shouldDisableUpdates = false,
+}: Props) {
   const onCSSValueChange = (value: string) => {
     setOutputSettings((prev) => {
       if (prev.js === JSFrameworkOption.REACT) {
         if (value !== CSSOption.TAILWIND) {
           toast.error(
-            "React only supports Tailwind CSS. Change JS framework to Vanilla to use Bootstrap."
+            'React only supports Tailwind CSS. Change JS framework to "No Framework" to use Bootstrap.'
           );
         }
         return {
@@ -122,6 +127,7 @@ function OutputSettingsSection({ outputSettings, setOutputSettings }: Props) {
   return (
     <div className="flex flex-col gap-y-2 justify-between text-sm">
       {generateDisplayString(outputSettings)}{" "}
+      {!shouldDisableUpdates && (
         <Popover>
           <PopoverTrigger asChild>
             <Button variant="outline">Customize</Button>
@@ -187,6 +193,7 @@ function OutputSettingsSection({ outputSettings, setOutputSettings }: Props) {
             </div>
           </PopoverContent>
         </Popover>
+      )}
     </div>
   );
 }