Setitngs: button to reset Android SDK path to default

Summary: Added button to reset Android SDK path to default + fixed default SDK path on Windows which I introduced in a previous diff and which before might be wrongly resolved to roaming data instead of local data folder

Reviewed By: jknoxville

Differential Revision: D19498899

fbshipit-source-id: e10865b528f55ea6b56873bdf9369c4b60dca89f

src/chrome/SettingsSheet.tsx

@@ -17,7 +17,7 @@ import {
 } from '../reducers/launcherSettings';
 import {connect} from 'react-redux';
 import {State as Store} from '../reducers';
-import {Settings} from '../reducers/settings';
+import {Settings, DEFAULT_ANDROID_SDK_PATH} from '../reducers/settings';
 import {flush} from '../utils/persistor';
 import ToggledSection from './settings/ToggledSection';
 import {FilePathConfigField, ConfigText} from './settings/configFields';
@@ -90,6 +90,7 @@ class SettingsSheet extends Component<Props, State> {
           }}>
           <FilePathConfigField
             label="Android SDK Location"
+            resetValue={DEFAULT_ANDROID_SDK_PATH}
             defaultValue={this.state.updatedSettings.androidHome}
             onChange={v => {
               this.setState({

src/chrome/settings/configFields.tsx

@@ -51,6 +51,7 @@ const GreyedOutOverlay = styled.div({
 
 export function FilePathConfigField(props: {
   label: string;
+  resetValue?: string;
   defaultValue: string;
   onChange: (path: string) => void;
   frozen?: boolean;
@@ -103,6 +104,16 @@ export function FilePathConfigField(props: {
         }>
         <CenteredGlyph name="dots-3-circle" variant="outline" />
       </FlexColumn>
+      {props.resetValue && (
+        <FlexColumn
+          title={`Reset to default path ${props.resetValue}`}
+          onClick={() => {
+            setValue(props.resetValue!);
+            props.onChange(props.resetValue!);
+          }}>
+          <CenteredGlyph name="undo" variant="outline" />
+        </FlexColumn>
+      )}
       {isValid ? null : (
         <CenteredGlyph name="caution-triangle" color={colors.yellow} />
       )}