diff --git a/public/app/features/datasources/components/picker/DataSourceDropdown.tsx b/public/app/features/datasources/components/picker/DataSourceDropdown.tsx
index 3f7a5487936..4038aaf1f25 100644
--- a/public/app/features/datasources/components/picker/DataSourceDropdown.tsx
+++ b/public/app/features/datasources/components/picker/DataSourceDropdown.tsx
@@ -222,11 +222,6 @@ const PickerContent = React.forwardRef<HTMLDivElement, PickerContentProps>((prop
         }
       ></DataSourceList>
       <div className={styles.footer}>
-        {onClickAddCSV && config.featureToggles.editPanelCSVDragAndDrop && (
-          <Button variant="secondary" size="sm" onClick={clickAddCSVCallback}>
-            Add csv or spreadsheet
-          </Button>
-        )}
         <ModalsController>
           {({ showModal, hideModal }) => (
             <Button
@@ -254,6 +249,11 @@ const PickerContent = React.forwardRef<HTMLDivElement, PickerContentProps>((prop
             </Button>
           )}
         </ModalsController>
+        {onClickAddCSV && config.featureToggles.editPanelCSVDragAndDrop && (
+          <Button variant="secondary" size="sm" onClick={clickAddCSVCallback}>
+            Add csv or spreadsheet
+          </Button>
+        )}
       </div>
     </div>
   );
@@ -280,6 +280,7 @@ function getStylesPickerContent(theme: GrafanaTheme2) {
     footer: css`
       flex: 0;
       display: flex;
+      flex-direction: row-reverse;
       justify-content: space-between;
       padding: ${theme.spacing(1.5)};
       border-top: 1px solid ${theme.colors.border.weak};