Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Google translate] Add a preference for the default action #12078

Merged
merged 10 commits into from
May 2, 2024
Merged

[Google translate] Add a preference for the default action #12078

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
6bfd2e5
Add a preference for the default action in Google Translate extension
Popalay Apr 29, 2024
d4470f0
refactoring
gebeto Apr 30, 2024
be6daa0
add missing sections
gebeto Apr 30, 2024
f62772f
remove unused keys
gebeto Apr 30, 2024
68d523d
fix logic
gebeto Apr 30, 2024
c8f5b65
remove extra comment
gebeto Apr 30, 2024
d76ada2
remove keys
gebeto Apr 30, 2024
4c4d0d3
update configurable actions name
gebeto Apr 30, 2024
1b91d6b
Merge pull request #1 from gebeto/google-translate-default-action-ref…
Popalay Apr 30, 2024
0c64e0d
Use generated ExtensionPreferences.
Popalay Apr 30, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions extensions/google-translate/CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
# Google Translate Changelog

## [Default Action preference for translations] - 2024-04-29
- Add a preference to set the default action for the translations

## [Re-added previously removed contributor] - 2024-04-26

## [Fix] - 2024-03-08
Expand Down
21 changes: 20 additions & 1 deletion extensions/google-translate/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,8 @@
"AlanHuang",
"nirtamir2",
"pernielsentikaer",
"rasitayaz"
"rasitayaz",
"popalay"
],
"license": "MIT",
"commands": [
Expand Down Expand Up @@ -943,6 +944,24 @@
"required": false,
"type": "checkbox",
"default": true
},
{
"name": "defaultAction",
"title": "Default Action",
"description": "The default action to take when translating.",
"type": "dropdown",
"required": false,
"default": "copy",
"data": [
{
"title": "Copy to Clipboard",
"value": "copy"
},
{
"title": "Paste to App",
"value": "paste"
}
]
}
],
"dependencies": {
Expand Down
3 changes: 2 additions & 1 deletion extensions/google-translate/src/QuickTranslate/QuickTranslateListItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { usePromise } from "@raycast/utils";
import { getLanguageFlag, supportedLanguagesByCode } from "../languages";
import { simpleTranslate } from "../simple-translate";
import { LanguageCodeSet } from "../types";
import { ConfigurableCopyPasteActions } from "../actions";

export function QuickTranslateListItem(props: {
debouncedText: string;
Expand Down Expand Up @@ -66,7 +67,7 @@ export function QuickTranslateListItem(props: {
actions={
<ActionPanel>
<ActionPanel.Section>
<Action.CopyToClipboard title="Copy" content={result.translatedText} />
<ConfigurableCopyPasteActions defaultActionsPrefix="Translation" value={result.translatedText} />
<Action
title="Toggle Full Text"
icon={Icon.Text}
Expand Down
34 changes: 34 additions & 0 deletions extensions/google-translate/src/actions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import React from "react";
import { Action, getPreferenceValues } from "@raycast/api";

interface ActionsOpts {
value: string;
defaultActionsPrefix?: string;
}

export const ConfigurableCopyPasteActions = ({ defaultActionsPrefix, value }: ActionsOpts) => {
const defaultPreference = getPreferenceValues<ExtensionPreferences>().defaultAction;

const pasteAction = (
<Action.Paste title={defaultActionsPrefix ? `Paste ${defaultActionsPrefix}` : `Paste`} content={value} />
);
const copyAction = (
<Action.CopyToClipboard title={defaultActionsPrefix ? `Copy ${defaultActionsPrefix}` : `Copy`} content={value} />
);

if (defaultPreference === "paste") {
return (
<>
{pasteAction}
{copyAction}
</>
);
}

return (
<>
{copyAction}
{pasteAction}
</>
);
};
4 changes: 2 additions & 2 deletions extensions/google-translate/src/translate-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { useDebouncedValue, useSelectedLanguagesSet, useTextState } from "./hook
import { LanguageCode, supportedLanguagesByCode, languages, getLanguageFlag } from "./languages";
import { AUTO_DETECT, simpleTranslate } from "./simple-translate";
import { LanguagesManagerList } from "./LanguagesManager";
import { ConfigurableCopyPasteActions } from "./actions";

export default function TranslateForm() {
const [selectedLanguageSet, setSelectedLanguageSet] = useSelectedLanguagesSet();
Expand Down Expand Up @@ -58,7 +59,7 @@ export default function TranslateForm() {
actions={
<ActionPanel>
<ActionPanel.Section title="Generals">
<Action.CopyToClipboard title="Copy Translated" content={translated?.translatedText ?? ""} />
<ConfigurableCopyPasteActions defaultActionsPrefix="Translated" value={translated?.translatedText ?? ""} />
<Action.CopyToClipboard title="Copy Text" content={text ?? ""} />
<Action.CopyToClipboard
title="Copy Pronunciation"
Expand All @@ -85,7 +86,6 @@ export default function TranslateForm() {
target={<LanguagesManagerList />}
/>
</ActionPanel.Section>

<ActionPanel.Section title="Settings">
<Action
shortcut={{ modifiers: ["cmd", "shift"], key: "s" }}
Expand Down
13 changes: 6 additions & 7 deletions extensions/google-translate/src/translate.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,11 @@
import React, { ReactElement, useState } from "react";
import { List, ActionPanel, showToast, Toast, Action, Icon } from "@raycast/api";
import { List, showToast, Toast, Action, Icon, ActionPanel } from "@raycast/api";
import { usePromise } from "@raycast/utils";
import { useDebouncedValue, useSelectedLanguagesSet, useTextState } from "./hooks";
import { getLanguageFlag, supportedLanguagesByCode } from "./languages";
import { LanguageManagerListDropdown } from "./LanguagesManager";
import { doubleWayTranslate, playTTS } from "./simple-translate";
import { ConfigurableCopyPasteActions } from "./actions";

export default function Translate(): ReactElement {
const [selectedLanguageSet] = useSelectedLanguagesSet();
Expand Down Expand Up @@ -42,16 +43,15 @@ export default function Translate(): ReactElement {
const tooltip = `${langFrom?.name ?? langFrom?.code} -> ${langTo?.name ?? langTo?.code}`;

return (
<>
<React.Fragment key={index}>
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@gebeto Just curious why it's needed here?

Copy link
Contributor

@gebeto gebeto Apr 30, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<></> is a shorthand for <React.Fragment></React.Fragment>, when we are assigning the key, we need to use React.Fragment, because we can't do <key={index}>

we need a key right on fragment here because it is an element that we are returning from the map. Key was used on nested elements before, and you could see an error in the console:
Screenshot 2024-04-30 at 13 52 02

More details about key you can get in official react docs here: https://react.dev/learn/rendering-lists
And here is also more details about Fragments and keys: https://react.dev/reference/react/Fragment#rendering-a-list-of-fragments

long story short - key should be applied to the root element which is returning from the map, in this case it is a Fragment

<List.Item
key={index}
title={r.translatedText}
accessories={[{ text: languages, tooltip: tooltip }]}
detail={<List.Item.Detail markdown={r.translatedText} />}
actions={
<ActionPanel>
<ActionPanel.Section>
Popalay marked this conversation as resolved.
Show resolved Hide resolved
<Action.CopyToClipboard title="Copy" content={r.translatedText} />
<ConfigurableCopyPasteActions defaultActionsPrefix="Translation" value={r.translatedText} />
<Action
title="Toggle Full Text"
icon={Icon.Text}
Expand Down Expand Up @@ -82,14 +82,13 @@ export default function Translate(): ReactElement {
/>
{r.pronunciationText && (
<List.Item
key={index}
title={r.pronunciationText}
accessories={[{ text: languages, tooltip: tooltip }]}
detail={<List.Item.Detail markdown={r.pronunciationText} />}
actions={
<ActionPanel>
<ActionPanel.Section>
<Action.CopyToClipboard title="Copy" content={r.pronunciationText} />
<ConfigurableCopyPasteActions value={r.pronunciationText} />
<Action
title="Toggle Full Text"
icon={Icon.Text}
Expand All @@ -113,7 +112,7 @@ export default function Translate(): ReactElement {
}
/>
)}
</>
</React.Fragment>
);
})}
</List>
Expand Down
2 changes: 1 addition & 1 deletion extensions/google-translate/tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"$schema": "https://json.schemastore.org/tsconfig",
"display": "Node 16",
"include": ["src/**/*"],
"include": ["src/**/*", "raycast-env.d.ts"],
"compilerOptions": {
"lib": ["es2020"],
"module": "commonjs",
Expand Down