chore(compass-components): small editorial fixes for FileInput (#6551)

Use Unicode ellipses and use consistent language for the
FileInputBackendContext wrappers.

packages/compass-components/src/components/file-input.spec.tsx

@@ -38,7 +38,7 @@ describe('FileInput', function () {
     );
 
     const button = screen.getByTestId('file-input-button');
-    expect(button.textContent).to.equal('Select a file...');
+    expect(button.textContent).to.equal('Select a file…');
   });
 
   it('renders "Select a file..." if values is empty and multi is false', function () {
@@ -53,7 +53,7 @@ describe('FileInput', function () {
     );
 
     const button = screen.getByTestId('file-input-button');
-    expect(button.textContent).to.equal('Select a file...');
+    expect(button.textContent).to.equal('Select a file…');
   });
 
   it('renders "Select files..." if values is falsy and multi is true', function () {
@@ -68,7 +68,7 @@ describe('FileInput', function () {
     );
 
     const button = screen.getByTestId('file-input-button');
-    expect(button.textContent).to.equal('Select files...');
+    expect(button.textContent).to.equal('Select files…');
   });
 
   it('renders "a.png" if values is [a.png]', function () {

packages/compass-components/src/components/file-input.tsx

@@ -168,7 +168,7 @@ export const FileInputBackendContext = createContext<
 
 // This hook is to create a new instance of the file input
 // backend provided by the context.
-function useFileSystemBackend() {
+function useFileInputBackend() {
   const fileInputBackendContext = useContext(FileInputBackendContext);
 
   const fileInputBackend = useRef<null | FileInputBackend>(
@@ -362,14 +362,14 @@ function FileInput({
   // To make components of Compass environment agnostic
   // (electron, browser, VSCode Webview), we use a backend context so that
   // the different environments can supply their own file system backends.
-  const backend = useFileSystemBackend();
+  const backend = useFileInputBackend();
 
   const buttonText = React.useMemo(() => {
     if (Array.isArray(values) && values.length > 0) {
       return values.map((file) => path.basename(file)).join(', ');
     }
 
-    return multi ? 'Select files...' : 'Select a file...';
+    return multi ? 'Select files…' : 'Select a file…';
   }, [values, multi]);
 
   const onFilesChanged = React.useCallback(

packages/compass-e2e-tests/helpers/commands/connect-form.ts

@@ -359,7 +359,7 @@ async function getFilename(
   selector: string
 ): Promise<string | null> {
   const text = await getText(browser, selector);
-  return text === 'Select a file...' ? null : text;
+  return text === 'Select a file…' ? null : text;
 }
 
 async function getValue(