feat(admin-ui): Always show currencies overview (#4541)

* move around featureflags

* add changeset

.changeset/funny-ties-tan.md

@@ -0,0 +1,5 @@
+---
+"@medusajs/admin-ui": patch
+---
+
+feat(admin-ui): always show list of currencies in currency overview

packages/admin-ui/ui/src/domain/settings/currencies/components/currency-tax-setting.tsx

@@ -1,12 +1,14 @@
-import { Currency } from "@medusajs/medusa"
-import { useQueryClient } from "@tanstack/react-query"
-import { adminStoreKeys, useAdminUpdateCurrency } from "medusa-react"
-import { useEffect } from "react"
 import { Controller, useForm } from "react-hook-form"
-import Switch from "../../../../components/atoms/switch"
+import { adminStoreKeys, useAdminUpdateCurrency } from "medusa-react"
+
 import CoinsIcon from "../../../../components/fundamentals/icons/coins-icon"
-import useNotification from "../../../../hooks/use-notification"
+import { Currency } from "@medusajs/medusa"
+import FeatureToggle from "../../../../components/fundamentals/feature-toggle"
+import Switch from "../../../../components/atoms/switch"
 import { getErrorMessage } from "../../../../utils/error-messages"
+import { useEffect } from "react"
+import useNotification from "../../../../hooks/use-notification"
+import { useQueryClient } from "@tanstack/react-query"
 
 type CurrencyTaxSettingFormType = {
   includes_tax: boolean
@@ -70,21 +72,23 @@ const CurrencyTaxSetting = ({ currency, isDefault }: Props) => {
             </div>
           )}
         </div>
-        <Controller
+        <FeatureToggle featureFlag="tax_inclusive_pricing">
-          control={control}
+          <Controller
-          name="includes_tax"
+            control={control}
-          render={({ field: { value, onChange } }) => {
+            name="includes_tax"
-            return (
+            render={({ field: { value, onChange } }) => {
-              <Switch
+              return (
-                checked={value}
+                <Switch
-                onCheckedChange={(data) => {
+                  checked={value}
-                  onChange(data)
+                  onCheckedChange={(data) => {
-                  onSubmit()
+                    onChange(data)
-                }}
+                    onSubmit()
-              />
+                  }}
-            )
+                />
-          }}
+              )
-        />
+            }}
+          />
+        </FeatureToggle>
       </div>
     </form>
   )

packages/admin-ui/ui/src/domain/settings/currencies/index.tsx

@@ -1,16 +1,16 @@
-import { useAdminStore } from "medusa-react"
-import { useNavigate } from "react-router-dom"
 import BackButton from "../../../components/atoms/back-button"
-import Spinner from "../../../components/atoms/spinner"
+import CurrencyTaxSetting from "./components/currency-tax-setting"
-import Tooltip from "../../../components/atoms/tooltip"
+import DefaultStoreCurrency from "./components/default-store-currency"
 import FeatureToggle from "../../../components/fundamentals/feature-toggle"
 import JSONView from "../../../components/molecules/json-view"
 import Section from "../../../components/organisms/section"
-import { useAnalytics } from "../../../providers/analytics-provider"
+import Spinner from "../../../components/atoms/spinner"
-import { getErrorStatus } from "../../../utils/get-error-status"
-import CurrencyTaxSetting from "./components/currency-tax-setting"
-import DefaultStoreCurrency from "./components/default-store-currency"
 import StoreCurrencies from "./components/store-currencies"
+import Tooltip from "../../../components/atoms/tooltip"
+import { getErrorStatus } from "../../../utils/get-error-status"
+import { useAdminStore } from "medusa-react"
+import { useAnalytics } from "../../../providers/analytics-provider"
+import { useNavigate } from "react-router-dom"
 
 const CurrencySettings = () => {
   const navigate = useNavigate()
@@ -77,10 +77,10 @@ const CurrencySettings = () => {
             <div className="mb-large">
               <StoreCurrencies store={store} />
             </div>
-            <FeatureToggle featureFlag="tax_inclusive_pricing">
+            <div className="cursor-default">
-              <div className="cursor-default">
+              <div className="inter-small-semibold text-grey-50 mb-base flex items-center justify-between">
-                <div className="inter-small-semibold text-grey-50 mb-base flex items-center justify-between">
+                <p>Currency</p>
-                  <p>Currency</p>
+                <FeatureToggle featureFlag="tax_inclusive_pricing">
                   <Tooltip
                     side="top"
                     content={
@@ -89,24 +89,24 @@ const CurrencySettings = () => {
                   >
                     <p>Tax Incl. Prices</p>
                   </Tooltip>
-                </div>
+                </FeatureToggle>
-                <div className="gap-base grid grid-cols-1">
-                  {store.currencies
-                    .sort((a, b) => {
-                      return a.code > b.code ? 1 : -1
-                    })
-                    .map((c, index) => {
-                      return (
-                        <CurrencyTaxSetting
-                          currency={c}
-                          isDefault={store.default_currency_code === c.code}
-                          key={index}
-                        />
-                      )
-                    })}
-                </div>
               </div>
-            </FeatureToggle>
+              <div className="gap-base grid grid-cols-1">
+                {store.currencies
+                  .sort((a, b) => {
+                    return a.code > b.code ? 1 : -1
+                  })
+                  .map((c, index) => {
+                    return (
+                      <CurrencyTaxSetting
+                        currency={c}
+                        isDefault={store.default_currency_code === c.code}
+                        key={index}
+                      />
+                    )
+                  })}
+              </div>
+            </div>
           </Section>
         </div>
         <div>