react-ua
React User Agent Component and Provider, SSR-ready, using new React Context API
Requirement
- React 16.8.0
Features
- Wrapper for ua-parser-js
- Using new React Hooks API
- Using new React Context API
- SSR-ready
- Unit-tested
Try it live at StackBlitz
import React from 'react';
import { UserAgentProvider, useUserAgent } from 'react-ua';
const Comp = () => {
const ua = useUserAgent();
return <div>OS: {ua.os.name}</div>;
};
const App = () => (
<UserAgentProvider>
<Comp />
</UserAgentProvider>
);
ReactDOM.render(<App />, document.getElementById('#root'));
// SSR
const el = (
<UserAgentProvider value={request.headers['user-agent']}>
<Comp />
</UserAgentProvider>
);
ReactDOMServer.renderToString(el);HOC (deprecated)
import { withUserAgent } from 'react-ua/hoc';
const CompWithHoc = withUserAgent(({ ua }) => <div>OS: {ua.os.name}</div>);
const App = () => (
<UserAgentProvider>
<CompWithHoc />
</UserAgentProvider>
);License
MIT