Attempted import error: 'personalspace' is not exported from './personal-space'

App.js

     import './App.css';
import { Button } from 'react-bootstrap';
import 'bootstrap/dist/css/bootstrap.min.css';
import React from 'react';
import Navibar from './Components/Navibar'
import { home } from './home';
import { messages } from './messages';
import { personalspace } from './personal-space';
import {
  BrowserRouter as Router,
  Switch,
  Route,
} from 'react-router-dom';


export default function App() {
  return(
    <>
    <Router>
    <Navibar />
    <Switch>
      <Route exact path='/' component={home} />
      <Route path='/messages' component={messages} />
      <Route path='/personalspace' component={personalspace} />
    </Switch>
    </Router>
    </>
  );
}

personal-space.js

import React from 'react'

export const personalspace = () => (
    <h1>Personal space</h1>
)

В чем ошибка?