this repo has no description
Experiment non-English description generation
+60
-1
+60
-1
src/components/compose.jsx
+60
-1
src/components/compose.jsx
···
28
28
import db from '../utils/db';
29
29
import emojifyText from '../utils/emojify-text';
30
30
import localeMatch from '../utils/locale-match';
31
+
import localeCode2Text from '../utils/localeCode2Text';
31
32
import openCompose from '../utils/open-compose';
32
33
import pmem from '../utils/pmem';
33
34
import shortenNumber from '../utils/shorten-number';
···
2023
2024
}}
2024
2025
>
2025
2026
<Icon icon="sparkles2" />
2026
-
<span>Generate description…</span>
2027
+
{lang && lang !== 'en' ? (
2028
+
<small>
2029
+
Generate description…
2030
+
<br />
2031
+
(English)
2032
+
</small>
2033
+
) : (
2034
+
<span>Generate description…</span>
2035
+
)}
2027
2036
</MenuItem>
2037
+
{!!lang && lang !== 'en' && (
2038
+
<MenuItem
2039
+
disabled={uiState === 'loading'}
2040
+
onClick={() => {
2041
+
setUIState('loading');
2042
+
toastRef.current = showToast({
2043
+
text: 'Generating description. Please wait...',
2044
+
duration: -1,
2045
+
});
2046
+
// POST with multipart
2047
+
(async function () {
2048
+
try {
2049
+
const body = new FormData();
2050
+
body.append('image', file);
2051
+
const params = `?lang=${lang}`;
2052
+
const response = await fetch(
2053
+
IMG_ALT_API_URL + params,
2054
+
{
2055
+
method: 'POST',
2056
+
body,
2057
+
},
2058
+
).then((r) => r.json());
2059
+
if (response.error) {
2060
+
throw new Error(response.error);
2061
+
}
2062
+
setDescription(response.description);
2063
+
} catch (e) {
2064
+
console.error(e);
2065
+
showToast(
2066
+
`Failed to generate description${
2067
+
e?.message ? `: ${e.message}` : ''
2068
+
}`,
2069
+
);
2070
+
} finally {
2071
+
setUIState('default');
2072
+
toastRef.current?.hideToast?.();
2073
+
}
2074
+
})();
2075
+
}}
2076
+
>
2077
+
<Icon icon="sparkles2" />
2078
+
<small>
2079
+
Generate description…
2080
+
<br />({localeCode2Text(lang)}){' '}
2081
+
<span class="more-insignificant">
2082
+
— experimental
2083
+
</span>
2084
+
</small>
2085
+
</MenuItem>
2086
+
)}
2028
2087
</Menu2>
2029
2088
)}
2030
2089
<button