From ed43f05c71259c9bc72750635a2c6c6019abe90b Mon Sep 17 00:00:00 2001 From: Kristian Antrobus Date: Tue, 21 Jan 2025 13:31:09 -0600 Subject: [PATCH 1/4] chore(intenral-docs): add icons doc --- internal-docs/engineering/icons.md | 21 +++++++++++++++++++++ package.json | 1 + 2 files changed, 22 insertions(+) create mode 100644 internal-docs/engineering/icons.md diff --git a/internal-docs/engineering/icons.md b/internal-docs/engineering/icons.md new file mode 100644 index 0000000000..4918f3ae37 --- /dev/null +++ b/internal-docs/engineering/icons.md @@ -0,0 +1,21 @@ +# Icons + +- [Icons](#icons) + - [Adding Icons](#adding-icons) + - [Generating Icons](#generating-icons) + +Our icons are converted from SVG to React components at compile time using our own “svg-to-react” library: [https://github.com/twilio-labs/svg-to-react](https://github.com/twilio-labs/svg-to-react) + +## Adding Icons + +The process for adding icons is very simple thanks to our naming conventions and conversion library. + +Any new SVG assets must be copied into the [svg](../../packages/paste-icons/svg/) folder. We often see the `viewBox` attribute missing so be sure the top level element has the following: + +```html + +``` + +## Generating Icons + +To generate newly added icons you can use the command `yarn convert:icons:new` from the root of the repo. This will create the new React components and appends the "Icon" string to the component name. diff --git a/package.json b/package.json index 9fc6055845..6121766806 100644 --- a/package.json +++ b/package.json @@ -51,6 +51,7 @@ "generate:embeddings:refresh": "yarn nx run @twilio-paste/website:generate:embeddings:refresh", "generate:db-types": "yarn nx run @twilio-paste/backend:generate:db-types", "generate:website-data": "yarn workspace @twilio-paste/website fetch:data", + "convert:icons:new": "yarn workspace @twilio-paste/icons convert-new", "pre-push": "concurrently \"yarn:lint\" \"yarn:test\" \"yarn:format\" \"yarn:type-check\"", "prerelease": "yarn build && yarn generate:website-data && yarn lint && yarn test", "release": "yarn changeset publish", From d8c4be27805101e96b7ac806e7e4eff4c374419d Mon Sep 17 00:00:00 2001 From: Kristian Antrobus Date: Tue, 21 Jan 2025 16:46:22 -0600 Subject: [PATCH 2/4] chore(internal-docs): backend development --- .../engineering/developing-locally.md | 70 +++++++++++++++++++ 1 file changed, 70 insertions(+) diff --git a/internal-docs/engineering/developing-locally.md b/internal-docs/engineering/developing-locally.md index 9a28a8570f..b1c86e9719 100644 --- a/internal-docs/engineering/developing-locally.md +++ b/internal-docs/engineering/developing-locally.md @@ -13,6 +13,7 @@ - [Working on components](#working-on-components) - [Working on the docs site](#working-on-the-docs-site) - [Working on Remix (Theme Designer)](#working-on-remix-theme-designer) + - [Working on Backend](#working-on-backend) ## Prerequisites @@ -300,3 +301,72 @@ Then run: ```bash yarn start:theme-designer ``` + +## Working on Website Backend + +This section covers how to setup the Supabase backend and + +### Prerequisites + +You will need docker or a similar service in odrer to start the local supabase instance. + +### Environment + +To run the backend and develop all functionality of the website you will need to add additional variable in the `.env` file previously configured + +**Note**: access can be granted internally to OpenAI via the Service portal + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
OPENAI_API_KEY + The token used to interact with OpenAI +
OPENAI_API_SECRET + The secret provided by OpenAI +
OPENAI_ASSISTANT_ID + The assistant id for the OpenAI project +
SUPABASE_URL + The url of the supabase BE you want to use. For local development is should map to http://127.0.0.1:54321 +
SUPABASE_KEY + This will be generated and output from the start command in `/apps/backend`. It can also be retreieved by running `npx supabase status` in the directory. +
GH_SERVICE_ACC_DISCUSSIONS_TOKEN + Used for embeddings script, must be a token with read access to Paste repo discussions. +
ROLLBAR_ACCESS_TOKEN + A dummy value can be used for local development e.g. "MOCK_TOKEN" +
+ +### Running Supabase + +Supabase is the data storage layer used by the application. We use it to store messages with the Paste AI Assistant and also storing embeddings used by our search functionality for pages and GitHub discussions. + +With Docker or a similar service running, you can start supabase by running `start:backend:dev`. This will output details of the envirnment lile auth tokens used to connect to the APIs and URLs of the frontent and services. + +You should be able to access the UI at http://localhost:54323. + +Migrations should be applied by default. If there are no tables on startup run the `db:reset` command in the `apps/backend` directory. \ No newline at end of file From deff32cc959bbd835f2bb699be3138e54ec8a059 Mon Sep 17 00:00:00 2001 From: Kristian Antrobus Date: Wed, 22 Jan 2025 15:14:14 -0600 Subject: [PATCH 3/4] chore(internal-docs): update backend docs --- internal-docs/engineering/developing-locally.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/internal-docs/engineering/developing-locally.md b/internal-docs/engineering/developing-locally.md index b1c86e9719..39b021ce58 100644 --- a/internal-docs/engineering/developing-locally.md +++ b/internal-docs/engineering/developing-locally.md @@ -304,11 +304,11 @@ yarn start:theme-designer ## Working on Website Backend -This section covers how to setup the Supabase backend and +This section covers how to setup the Supabase backend and configuring additional environemnt variables. This will enable development of AI assistant and generation scripts such as [generate-embeddings.ts](../../packages/paste-website/scripts/search/generate-embeddings.ts) ### Prerequisites -You will need docker or a similar service in odrer to start the local supabase instance. +You will need docker or a similar service in order to start the local supabase instance. ### Environment @@ -338,13 +338,13 @@ To run the backend and develop all functionality of the website you will need to SUPABASE_URL - The url of the supabase BE you want to use. For local development is should map to http://127.0.0.1:54321 + The url of the supabase backend you want to use. For local development is should map to http://127.0.0.1:54321 SUPABASE_KEY - This will be generated and output from the start command in `/apps/backend`. It can also be retreieved by running `npx supabase status` in the directory. + This will be generated and output from the start command in `/apps/backend`. It can also be retrieved by running `npx supabase status` in the directory. @@ -365,7 +365,7 @@ To run the backend and develop all functionality of the website you will need to Supabase is the data storage layer used by the application. We use it to store messages with the Paste AI Assistant and also storing embeddings used by our search functionality for pages and GitHub discussions. -With Docker or a similar service running, you can start supabase by running `start:backend:dev`. This will output details of the envirnment lile auth tokens used to connect to the APIs and URLs of the frontent and services. +With Docker or a similar service running, you can start supabase by running `start:backend:dev`. This will output details of the envirnment such as auth tokens used to connect to the APIs and URLs of the frontent and services. You should be able to access the UI at http://localhost:54323. From 564c0bc54d8f6d3045b6e3d927d16b0f83d3d364 Mon Sep 17 00:00:00 2001 From: Kristian Antrobus Date: Thu, 23 Jan 2025 08:53:12 -0600 Subject: [PATCH 4/4] chore(internal-docs): fix typo --- internal-docs/engineering/developing-locally.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/internal-docs/engineering/developing-locally.md b/internal-docs/engineering/developing-locally.md index 39b021ce58..55496823fc 100644 --- a/internal-docs/engineering/developing-locally.md +++ b/internal-docs/engineering/developing-locally.md @@ -304,7 +304,7 @@ yarn start:theme-designer ## Working on Website Backend -This section covers how to setup the Supabase backend and configuring additional environemnt variables. This will enable development of AI assistant and generation scripts such as [generate-embeddings.ts](../../packages/paste-website/scripts/search/generate-embeddings.ts) +This section covers how to setup the Supabase backend and configuring additional environment variables. This will enable development of AI assistant and generation scripts such as [generate-embeddings.ts](../../packages/paste-website/scripts/search/generate-embeddings.ts) ### Prerequisites