Repository: hydralauncher/hydra
File: src/renderer/src/pages/game-details/modals/game-options-modal.tsx (TypeScript)

Code before:
              />
            </div>
          )}

          {shouldShowLaunchOptionsConfiguration && (
            <div className={styles.gameOptionHeader}>
              <h2>{t("launch_options")}</h2>
              <h4 className={styles.gameOptionHeaderDescription}>
                {t("launch_options_description")}
              </h4>
              <TextField
                value={launchOptions}
                theme="dark"
                placeholder={t("launch_options_placeholder")}
                onChange={handleChangeLaunchOptions}
                rightContent={
                  <>
                    {game.launchOptions && (
                      <Button
                        onClick={handleClearLaunchOptions}
                        theme="outline"
                      >
                        {t("clear")}
                      </Button>
                    )}
                  </>
                }
              />
            </div>
          )}

          <div className={styles.gameOptionHeader}>
            <h2>{t("downloads_secion_title")}</h2>
            <h4 className={styles.gameOptionHeaderDescription}>
              {t("downloads_section_description")}
            </h4>
          </div>

          <div className={styles.gameOptionRow}>
            <Button
              onClick={() => setShowRepacksModal(true)}
              theme="outline"
              disabled={deleting || isGameDownloading || !repacks.length}
            >
              {t("open_download_options")}
            </Button>
            {game.downloadPath && (
              <Button
                onClick={handleOpenDownloadFolder}
                theme="outline"
                disabled={deleting}

Review comment (suggestion):
Here there's no need to add a react fragment, as there only one element. this is enough:
```suggestion
                  game.launchOptions && (
                    <Button onClick={handleClearLaunchOptions} theme="outline">
                      {t("clear")}
                    </Button>
                  )
```

Code after:
                        theme="outline"
                      >
                        {t("clear")}
                      </Button>
                    )}
                  </>
                }
              />
            </div>
          )}

          {shouldShowLaunchOptionsConfiguration && (
            <div className={styles.gameOptionHeader}>
              <h2>{t("launch_options")}</h2>
              <h4 className={styles.gameOptionHeaderDescription}>
                {t("launch_options_description")}
              </h4>
              <TextField
                value={launchOptions}
                theme="dark"
                placeholder={t("launch_options_placeholder")}
                onChange={handleChangeLaunchOptions}
                rightContent={
                  game.launchOptions && (
                    <Button onClick={handleClearLaunchOptions} theme="outline">
                      {t("clear")}
                    </Button>
                  )
                }
              />
            </div>
          )}

          <div className={styles.gameOptionHeader}>
            <h2>{t("downloads_secion_title")}</h2>
            <h4 className={styles.gameOptionHeaderDescription}>
              {t("downloads_section_description")}
            </h4>
          </div>

          <div className={styles.gameOptionRow}>
            <Button
              onClick={() => setShowRepacksModal(true)}
              theme="outline"
              disabled={deleting || isGameDownloading || !repacks.length}
            >
              {t("open_download_options")}
            </Button>
            {game.downloadPath && (
              <Button
                onClick={handleOpenDownloadFolder}