feat: publish local rules

gui/src/components/mainInput/Lump/PublishBlockButton.tsx

@@ -0,0 +1,49 @@
+import { BlockType } from "@continuedev/config-yaml";
+import { CloudArrowUpIcon } from "@heroicons/react/24/outline";
+import { useContext } from "react";
+import { IdeMessengerContext } from "../../../context/IdeMessenger";
+import HeaderButtonWithToolTip from "../../gui/HeaderButtonWithToolTip";
+
+/**
+ * Button for publishing a block to the Hub
+ */
+interface PublishBlockButtonProps {
+  /** Path to the block file on disk */
+  blockFilepath: string;
+  /** Type of block */
+  blockType: BlockType;
+}
+
+export const PublishBlockButton: React.FC<PublishBlockButtonProps> = ({
+  blockFilepath,
+  blockType,
+}) => {
+  const ideMessenger = useContext(IdeMessengerContext);
+
+  async function handlePublish() {
+    const fileContent = await ideMessenger.request("readFile", {
+      filepath: blockFilepath,
+    });
+
+    if (fileContent.status !== "success") {
+      ideMessenger.post("showToast", [
+        "error",
+        "Failed to read contents of file",
+      ]);
+      return;
+    }
+
+    const encodedContent = encodeURIComponent(fileContent.content);
+
+    ideMessenger.request("controlPlane/openUrl", {
+      path: `new?type=block&blockType=${blockType}&blockContent=${encodedContent}`,
+      orgSlug: undefined,
+    });
+  }
+
+  return (
+    <HeaderButtonWithToolTip onClick={handlePublish} text="Publish">
+      <CloudArrowUpIcon className="h-3 w-3 text-gray-400" />
+    </HeaderButtonWithToolTip>
+  );
+};

gui/src/components/mainInput/Lump/sections/RulesSection.tsx

@@ -20,6 +20,7 @@ import {
 } from "../../../../redux/slices/uiSlice";
 import HeaderButtonWithToolTip from "../../../gui/HeaderButtonWithToolTip";
 import { useFontSize } from "../../../ui/font";
+import { PublishBlockButton } from "../PublishBlockButton";
 import { ExploreBlocksButton } from "./ExploreBlocksButton";
 
 interface RuleCardProps {
@@ -30,6 +31,11 @@ const RuleCard: React.FC<RuleCardProps> = ({ rule }) => {
   const dispatch = useAppDispatch();
   const ideMessenger = useContext(IdeMessengerContext);
 
+  // Once we have the properties to determine if the `rules-block` is
+  // local vs hub, and what the file URI to that block is,
+  // we can then implement this
+  const isLocalRulesBlock = rule.source === "rules-block" && false;
+
   const handleOpen = async () => {
     if (rule.slug) {
       ideMessenger.request("controlPlane/openUrl", {
@@ -81,6 +87,7 @@ const RuleCard: React.FC<RuleCardProps> = ({ rule }) => {
 
   const smallFont = useFontSize(-2);
   const tinyFont = useFontSize(-3);
+
   return (
     <div
       style={{
@@ -100,9 +107,12 @@ const RuleCard: React.FC<RuleCardProps> = ({ rule }) => {
             {title}
           </span>
           <div className="flex flex-row items-start gap-1">
-            <HeaderButtonWithToolTip onClick={onClickExpand} text="Expand">
-              <ArrowsPointingOutIcon className="h-3 w-3 text-gray-400" />
-            </HeaderButtonWithToolTip>{" "}
+            {isLocalRulesBlock ? (
+              <PublishBlockButton
+                blockFilepath={rule.ruleFile ?? ""}
+                blockType="rules"
+              />
+            ) : null}
             {rule.source === "default" ? (
               <HeaderButtonWithToolTip onClick={handleOpen} text="View">
                 <EyeIcon className="h-3 w-3 text-gray-400" />
@@ -112,6 +122,9 @@ const RuleCard: React.FC<RuleCardProps> = ({ rule }) => {
                 <PencilIcon className="h-3 w-3 text-gray-400" />
               </HeaderButtonWithToolTip>
             )}
+            <HeaderButtonWithToolTip onClick={onClickExpand} text="Expand">
+              <ArrowsPointingOutIcon className="h-3 w-3 text-gray-400" />
+            </HeaderButtonWithToolTip>
           </div>
         </div>
 
@@ -146,6 +159,7 @@ export function RulesSection() {
 
   const config = useAppSelector((store) => store.config.config);
   const mode = useAppSelector((store) => store.session.mode);
+
   const sortedRules: RuleWithSource[] = useMemo(() => {
     const rules = [...config.rules.map((rule) => ({ ...rule }))];