Home Assistant Add-on

[gullygossner]

I'm not sure if you are familiar with Home Assistant or not but I feel like this would make a great add-on within HA.

I believe there is a way to make docker containers add-ons within Home Assistant, I am just not well versed enough with docker to be able to complete this myself.

[vabene1111]

i actually use home assistant myself and really like it so yes, this is a great idea.

I have no idea how difficult it would be to implement, i definitly need to find a way to configure the environment variables but apart from that it should not be to hard i hope.

[vabene1111]

ok it appears to be easy to create an addon https://developers.home-assistant.io/docs/add-ons/

But it also appears that there is more to it than just throwing in a docker compose for more complex applications https://github.com/hassio-addons/addon-grafana/tree/main

one could obviously use sqlite and gunicorn webserving, that would probably eliminate the need for anything complex

[gullygossner]

That's completely fair, I have no idea what the complexities are to this stuff but just figured I'd pose the question. I may try firing it in docker I'm just worried about a port overlap or something borking my home assistant instance which is higher priority for me to have running.

[tdvantine]

I would love to see a meal plan add on.

[hillbicks]

Came here looking whether this is already being discussed, although my focus would be different.

I think there are plenty of users, who are using home assistant on a tablet in the kitchen. So while having an addon for HA would be great, I think the bigger benefit would be to have some sort of a tandoor card that can display recipes stored in tandoor and can be interacted with. Administration can be in tandoor itself, use the tandoor card only for usage with touch friendly design.

Create a page with an overview of the recipes, click on it and it takes you to the detailed steps. Touch friendly buttons to mark and hide the completed steps and automatically start a timer for steps, which have a timer configured.

In my opinion, that would be a fanatastic addition to HA and it would be a unique feature of tandoor, something to set yourself apart.

Anyway, great app. Keep it up!

[tdvantine]

Reading that made me think that with the right settings you might be able to get an iFrame to work...not saying it would be pretty or anything, but it could get ya by until a real plugin is made by the community or vabene. I my self may look into that.

[IxsharpxI]

i really hope to see this come to light. would be a great addition

[vabene1111]

Basically allow the recipe view to live in an i frame that is responsive enough to scale correctly to the home assistant card 🤔 i guess that would be really nice. Obviously installing in home assistant would be even better but that seems to be a bit of work to get it working

[zacps]

I'm really interested in adding timers as mentioned by @hillbicks, even if just in the webpage.

@vabene1111 do you have any opinions on how you'd like this to be implemented?

[vabene1111]

i guess timer would be quite simple to add into the recipe view (which is already migrated to the new vue.js component system)

There is a small modal in the time field which might be used. One would have too see if the current system which can simply add minutes to the step is sufficient or if something more in depth is needed.

Timers could also be included in the text using the templating engine ...

[zacps]

Ok thanks, I'll try to have a look at this soon. No promises on timing though so don't let that stop anyone else that wants to take it on.

[simeonradivoev]

Just adding an IFrame Panel works great. The only gotchas are that you need it to be running in HTTPS and if using a reverse proxy you need to modify your x-frame options.

[tdvantine]

What do you need to modify as far as those xframe options?

[tdvantine]

@simeonradivoev would you mind just posting your nginx conf? (assuming you are using nginx for the reverse proxy) I am rewritting the manual instal guide and trying to nail down the best nginx setup.

[simeonradivoev]

location / {
	proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Forwarded-Host $server_name;
	proxy_pass http://web_recipes:8080;
	proxy_hide_header X-Frame-Options;
    }

The proxy_hide_header X-Frame-Options; is the key.

[simeonradivoev]

The biggest issue is you have to expose the recipes to the world. Not sure if there is a way for a home assistant to serve a website from its local network and display it. I guess that's where a plugin might comee in.

[tdvantine]

Could run it locally then reverse proxy it. Edit: I say that without fully reading that you already have it reversed lol sorry, lots of projects all at once.

[simeonradivoev]

How can you not expose a recipes website that needs to be shown in an IFrame in an exposed Home Assistant? Wouldn't the recipes website need to be accessible from the outside, to also be accessible from an IFrame in an exposed home assistant? It's not an app that is served by the home assistant's web server.

[JamesDAdams]

we can not activate the iframe without adding an nginx container ? i use directly traefik with recipes

[vabene1111]

i think the server needs to allow i frame embedding. This might be possible with traefik but if not, adding the nginx back into the loop will not cause any harm so might as well do that

[JamesDAdams]

i think the server needs to allow i frame embedding. This might be possible with traefik but if not, adding the nginx back into the loop will not cause any harm so might as well do that

I would like to avoid adding a container just for that ^^

[nliakm]

Hi, in case someone also has recipes running on kubernetes. This is how my ingressroute (i use traefik) looks like to allow having the iframe load inside home-assistant:

---
apiVersion: traefik.containo.us/v1alpha1
kind: IngressRoute
metadata:
  annotations:
    kubernetes.io/ingress.class: "traefik"
    cert-manager.io/cluster-issuer: "letsencrypt-production"
    hajimari.io/enable: "true"
    hajimari.io/icon: "chef-hat"
  name: recipes
  namespace: default
spec:
  entryPoints:
    - websecure
  routes:
    - match: Host(`rezepte.${SECRET_DOMAIN}`) && PathPrefix(`/`)
      kind: Rule
      middlewares:
        - name: recipes-headers
      services:
        - kind: Service
          name: recipes
          namespace: default
          port: 8080
    - match: Host(`rezepte.${SECRET_DOMAIN}`) && PathPrefix(`/media`)
      kind: Rule
      middlewares:
        - name: recipes-headers
      services:
        - kind: Service
          name: recipes
          namespace: default
          port: 80
    - match: Host(`rezepte.${SECRET_DOMAIN}`) && PathPrefix(`/static`)
      kind: Rule
      middlewares:
        - name: recipes-headers
      services:
        - kind: Service
          name: recipes
          namespace: default
          port: 80
  tls:
    secretName: "recipes-tls-secret"
---
apiVersion: traefik.containo.us/v1alpha1
kind: Middleware
metadata:
  name: recipes-headers
  namespace: default
spec:
  headers:
    customResponseHeaders:
      X-Frame-Options: ""

FYI: My config differs from the 70-ingress.yaml inside the docs, because I use traefik v2 (reference: https://doc.traefik.io/traefik/migration/v1-to-v2/)

[iamkarlson]

There's actually an addon already exists: https://github.com/alexbelgium/hassio-addons/tree/master/tandoor_recipes

It doesn't have proper documentation and need some technical updates like using hassio ingress but it works!

[vabene1111]

This is super awesome, i did not know this existed. @alexbelgium do you want to work together on adding a doc page to the tandoor documentation about your addon so more people will know about it ?

Is there anything i can do in order to improve setup (maybe provide ways to allow the user to make the settings over the HA ui or whatever, i am not that deep into HA addons and how they are configured) ?

[alexbelgium]

Hi, thanks! Of course I would gladly accept all PR to improve documentation :-) And congrats for your great app!

Currently the addon is rather simple with the following options, that are exported and passed to Tandoor as environment variables :

Mandatory :

    "SECRET_KEY": secret key as per documentation
    "DB_TYPE": "list(sqlite|postgresql_external|mariadb_addon)" # Mariadb is automatically configured in the relevant HA addon if it is installed, sqlite is your default one

Optional :

    "ALLOWED_HOSTS"
    "POSTGRES_HOST" # Needed for postgresql_external
    "POSTGRES_PORT" # Needed for postgresql_external
    "POSTGRES_USER" # Needed for postgresql_external
    "POSTGRES_PASSWORD" # Needed for postgresql_external
    "POSTGRES_DB" # Needed for postgresql_external

I did not include ingress at this stage but would gladly do so! It's super easy : we just need to add a few additional configs in the config.json file, but mostly have a routing proxing inside the container to allow the app to show in Ingress.

I am not myself a user of the app - it was developed as a request. Therefore I don't necessarly see which things could be improved. People are welcome to make suggestions & PR !

[alexbelgium]

I've created an empty documentation file that we can use

[alexbelgium]

For ingress implementation, there are several requisites :

• That the app supports relative urls (as Ingress will route http://HA-ip:HA-oirt/api/api/hassio_ingress/INGRESS_CODED_URL/ to 0.0.0.0:APP_PORT)
• That the app does not modifies urls to make them case insensitive
• That a routing agent such as nginx is included in the container (which can be added rather easily)

Usually it's the first element that is most limitent :-) but I must admit I haven't tried yet ;-) I've copied the addon to my test repo so we can test ingress addition there : https://github.com/alexbelgium/hassio-addons-test

[vabene1111]

thanks for the feedback! I will look into writing some simple docs and just install it for testing on my HA instance.

Regarding ingress i must admit that even given your great description i do not understand what i need to do here

• relative urls: i would think that tandoor supports this via subpath configuration
• i think URLs are case insensitive in tandoor/django
• the routing agent: someone made the recommendation to add a custom nginx image but to be honest i am thinking about just adding nginx directly to the container so that all those issues that people are having with seperate configs are going away.

[alexbelgium]

That's great :) for ingress I'll put the addon in my test repo with the basic config needed and we'll see from there what works or not and what we'll have to tweak :) not sure when I'll have the time but in the coming days

[iamkarlson]

@alexbelgium don't hesitate to tag me if you need any help. I'm not really in hassio addons, but can help with testing or some django tweaking

[alexbelgium]

@iamkarlson thanks for your proposal. I have pushed a new version in my main repo. Could you please install and test if everything seems to work properly? thank you

Edit : it seems there is a bug adding new recipes from ingress

[alexbelgium]

I am having difficulties with ingress - it seems many links go back to root url. What would be the best way to avoid that? I'm trying nginx subfilters, but it is really not optimal especially for /api...

[vabene1111]

if there is anything i can do in the application let me know

[alexbelgium]

Thanks, currently I don't find a consistent way to make it work but I'll find. There are some things strange : for example if I set the proxy_set_header X-Script-Name to %%ingress_entry%%;, I can see recipes but clicking on the logo doesn't work as it goes to the url without the / at the end, which is the nginx ingress entry point. If I add the /, as in %%ingress_entry%%/;, then the link through the logo works but then the recipes visualization don't as there is a double // in the url.

Probably however this is because I am misusing this parameter. I'll investigate more

[iamkarlson]

@alexbelgium I tried to install it from your test repo but there's some weirdness and I don't see it:

[alexbelgium]

Hi, I put it now in the main repo, but ingress doesn't work... I have put it in pause for the moment as I can't see a way to make it work for both ingress and direct access as js files don't support relative url

[thibaultmol]

Would be nice if ingress could work yeah, maybe @vabene1111 can help?

[alexbelgium]

I'll look at it again in the near future

[alexbelgium]

Hi, ingress is added, please let me know if everything works. Thanks!

[vabene1111]

This is super cool, we need to create a special page in the docs for HA installation (repo link and a few short steps)

[alexbelgium]

Hi, I'll look at that, do you have a recommended location for those info ?

[vabene1111]

Oh nice, thanks that awesome.

I would love it on the same level as docker, unraid, synology and the others.