Todo List(s)

[luixal]

Hi!

I'm thinking about developing a custom component for having a to-do list in Homer. Thing is, it may be a little more complicated than the PiHole custom component due to data providing.

I generally use more than one app for managing todo/tasks lists (work/home). Joplin, Google Keep (which doesn't have an API right now), Microsoft Tasks, Wunderlist...

I've been thinking around this idea and the best solution, to avoid boilerplate, would be to have a custom component with different data providers. This way I could make a ToDo list card and then, according to configuration, I can sync the list with the right service.

Would it be ok if I split the component this way, placing files ToDoList.vue, ToDoListProviderGoogleKeep.vue and ToDoListProviderJoplin.vue in the services folder all toghether?

Would it be better adding a providers folder somewhere?

And, more important, is anyone interested on this feature?

[bastienwirtz]

Hi @luixal !

Nice idea. I think it would be better to have complex component with multiple source file in a folder, maybe be something like: Make the dynamic service component loader look for MyService.vue, and if the import fail, seemlessly try MyService/MyService.vue. Maybe not best for performance as it might do an extra request for the first try? Might need some tests to see what's best.

What do you think @luixal?

[luixal]

I was thinking in an intermediate approach. Let me explain:

In the Service.vue file, in de computed function you do load dynamic components having a look at type. So if it's not Generic, you load a file with that name from the services folder. Sweetly implemented like this:

const type = this.item.type || "Generic";
  if (type == "Generic") {
    return Generic;
  }
  return () => import(`./services/${type}.vue`);

So, if I add a custom component with type ToDoList, it will load a file ToDoList.vue from the services folder. Everything great to this point.

Now, I will need to load a different DataProvider according to the one configured in the ToDoList custom component. As they ca be many, I'm thinking the best option is to place them in a folder ToDoListProviders so I can import then using the same implementation above: if dataProviderconfig value is, for example, Joplin it will load file Joplin.js from folder services/ToDoListProviders/.

I think is a middle point where no changes are needed, no double check for file or folder.

What do you think is best?

PS: Many projects, when they hit this issue, move all custom plugins to folders to keep coherence. Maybe you prefer to do that?