Function addRecipeButton

public/js/aiChat.js:582–638

(recipe)

    recipeRailEl.innerHTML = '';

    const addRecipeButton = (recipe) => {
      const wrap = document.createElement('div');
      wrap.style.display = 'inline-flex';
      wrap.style.alignItems = 'center';
      wrap.style.gap = '4px';
      wrap.style.maxWidth = '100%';

      const runBtn = document.createElement('button');
      runBtn.type = 'button';
      runBtn.className = 'btn btn-sm btn-light';
      runBtn.style.borderRadius = '999px';
      runBtn.style.padding = '4px 10px';
      runBtn.style.fontSize = '11px';
      runBtn.style.lineHeight = '1.2';
      runBtn.style.maxWidth = '260px';
      runBtn.style.overflow = 'hidden';
      runBtn.style.textOverflow = 'ellipsis';
      runBtn.style.whiteSpace = 'nowrap';
      runBtn.textContent = recipe.builtin ? `${recipe.name}` : `${recipe.pinned ? '★ ' : ''}${recipe.name}`;
      runBtn.title = recipe.prompt || recipe.name;
      runBtn.addEventListener('click', () => runRecipe(recipe));
      wrap.appendChild(runBtn);

      if (!recipe.builtin) {
        const pinBtn = document.createElement('button');
        pinBtn.type = 'button';
        pinBtn.className = 'btn btn-sm btn-light';
        pinBtn.style.borderRadius = '999px';
        pinBtn.style.padding = '4px 8px';
        pinBtn.style.fontSize = '11px';
        pinBtn.style.lineHeight = '1.2';
        pinBtn.textContent = recipe.pinned ? 'Unpin' : 'Pin';
        pinBtn.title = recipe.pinned ? 'Unpin recipe' : 'Pin recipe';
        pinBtn.addEventListener('click', (event) => {
          event.stopPropagation();
          toggleRecipePin(recipe);
        });
        wrap.appendChild(pinBtn);

        const deleteBtn = document.createElement('button');
        deleteBtn.type = 'button';
        deleteBtn.className = 'btn btn-sm btn-light';
        deleteBtn.style.borderRadius = '999px';
        deleteBtn.style.padding = '4px 8px';
        deleteBtn.style.fontSize = '11px';
        deleteBtn.style.lineHeight = '1.2';
        deleteBtn.textContent = 'Delete';
        deleteBtn.title = 'Delete recipe';
        deleteBtn.addEventListener('click', (event) => {
          event.stopPropagation();
          deleteRecipe(recipe);
        });
        wrap.appendChild(deleteBtn);
      }

      recipeRailEl.appendChild(wrap);
    };