(option: ContextMenuQueryItem)
| 74 | }, []) |
| 75 | |
| 76 | const renderOptionContent = (option: ContextMenuQueryItem) => { |
| 77 | switch (option.type) { |
| 78 | case ContextMenuOptionType.SectionHeader: |
| 79 | return ( |
| 80 | <span |
| 81 | style={{ |
| 82 | fontWeight: "bold", |
| 83 | fontSize: "0.85em", |
| 84 | opacity: 0.8, |
| 85 | }}> |
| 86 | {option.label} |
| 87 | </span> |
| 88 | ) |
| 89 | case ContextMenuOptionType.Mode: |
| 90 | return ( |
| 91 | <div style={{ display: "flex", flexDirection: "column", gap: "2px" }}> |
| 92 | <div style={{ lineHeight: "1.2" }}> |
| 93 | <span>{option.slashCommand}</span> |
| 94 | </div> |
| 95 | {option.description && ( |
| 96 | <span |
| 97 | style={{ |
| 98 | opacity: 0.5, |
| 99 | fontSize: "0.9em", |
| 100 | lineHeight: "1.2", |
| 101 | whiteSpace: "nowrap", |
| 102 | overflow: "hidden", |
| 103 | textOverflow: "ellipsis", |
| 104 | }}> |
| 105 | {option.description} |
| 106 | </span> |
| 107 | )} |
| 108 | </div> |
| 109 | ) |
| 110 | case ContextMenuOptionType.Command: |
| 111 | return ( |
| 112 | <div style={{ display: "flex", flexDirection: "column", gap: "2px" }}> |
| 113 | <div style={{ lineHeight: "1.2", display: "flex", alignItems: "center", gap: "6px" }}> |
| 114 | <span>{option.slashCommand}</span> |
| 115 | {option.argumentHint && ( |
| 116 | <span |
| 117 | style={{ |
| 118 | opacity: 0.5, |
| 119 | fontSize: "0.9em", |
| 120 | lineHeight: "1.2", |
| 121 | }}> |
| 122 | {option.argumentHint} |
| 123 | </span> |
| 124 | )} |
| 125 | </div> |
| 126 | {option.description && ( |
| 127 | <span |
| 128 | style={{ |
| 129 | opacity: 0.5, |
| 130 | fontSize: "0.9em", |
| 131 | lineHeight: "1.2", |
| 132 | whiteSpace: "nowrap", |
| 133 | overflow: "hidden", |
no test coverage detected