option to add custom flags

[Yasuhiro SHIMIZU]

It would be great if there's an option to add custom flags to $device definition.

I need to detect whether the browser is my company's app, and I'd like to keep the same API as other Mobile/Desktop detection.

So far I took the approach described here, but would be nice if there's a built-in feature for this

[Yasuhiro SHIMIZU]

Here's my idea

{
  defaultUserAgent: '...',
  customFlags: {
    'isMyApp': function(userAgent, device) {
      // arguments are userAgent and device, so that we can use library's default flags.
      // return true or false based on the custom check
    }
  }
}

[Sébastien Chopin]

I like the idea, ideally you should be able to do this with a plugin by directly adding $device.isMyApp = ...

I think exposing $device.userAgent might be enough for this.

I want to avoid adding more config in Nuxt.config since changing it will have a full reload on Nuxt server

[Yasuhiro SHIMIZU]

I think exposing $device.userAgent might be enough for this.

Yeah, this should be enough.
Getting the UserAgent is kind of the toughest part in this issue.

Here's what I am doing now.

export default (ctx: Context, inject: (key: string, value: any) => void) => {
  const userAgent = getUserAgent(ctx)

  const isApp = isMyApp(userAgent)
  ctx.isMyApp = isApp

  inject('device', {
    ...ctx.app.$device,
    isMyApp: isApp,
  })
}

[Sébastien Chopin]

I created a PR to improve the module on #56

You can see an example of adding another flag here: https://codesandbox.io/s/github/nuxt-community/device-module/tree/feat/improvements?file=/test/fixture/plugins/custom-flag.js

Would that fix your issue @yshrsmz ?

[Yasuhiro SHIMIZU]

@Atinux Thanks, this is great!